JavaScript的var,let和const有什么区别

发布时间:2022-10-22 15:00:15 作者:iii
来源:亿速云 阅读:110

本篇内容主要讲解“JavaScript的var,let和const有什么区别”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“JavaScript的var,let和const有什么区别”吧!

ES5与ES6的区别

1. 作用域

使用不同的关键字来声明变量,主要就是对变量的作用域有不同的限制,因此var和let最主要的区别就是变量作用域的区别。

做题的时候经常会有在全局和函数体内声明同名变量的场景,要知道不同作用域的变量是不会互相干扰的。

var a = 10;
function logA() {
    var a = 20;
    console.log(a); // 20
}
console.log(a); // 10

2. 全局属性

在全局作用域下使用var和let声明变量,变量都是会在页面的声明周期内存续。

但是使用var声明的变量会成为window对象的属性,使用let声明则不会

3. 变量提升与暂时性死区

变量的声明、初始化和赋值被分为三步进行,对于var变量,声明和初始化会被提升到作用域的顶部。

也就是说,编译器在遇到var声明时,会先在作用域顶部声明一个var变量并将其初始化为undefined值。

因此在代码执行流遇到var声明语句之前访问var变量并不会报错,而是会访问到undefined值。

(function example() {
  console.log(age); // undefined
  var age = 20;
})();

// 相当于
(function example() {
  var age;
  console.log(age); // undefined
  age = 20;
})();

即JavaScript引擎在编译时如果遇到let和const声明,会将它们放入暂时性死区以阻止访问,只有在执行到变量声明的语句后,才会将变量从TDZ中移出。

因此如果在变量声明语句之前访问变量,相当于企图访问TDZ中的变量,JavaScript会抛出运行时错误ReferenceError

ES5的变量提升和ES6的暂时性死区的区别还有一个“副作用”就是改变了typeof操作对于变量的访问性。

已知在ES5时对于未声明变量唯一的安全操作是typeof,会返回undefined值。

TDZ的出现导致即使使用typeof,也不能在let和const声明语句执行之前访问let和const变量,依然会报ReferenceError

4. 重复声明

这个限制不仅体现在let声明对let声明,如果想用let去重复声明var变量也是不被允许的。

let与const的区别

1. 常量

同样都是ES6的变量声明关键字,let和const的区别就在于使用const声明创建的是一个值的只读引用

只读引用意味着对于原始值来说,const声明不可以再重新赋值;

对于引用值来说,const声明不可以再修改引用,但是可以修改对象的属性值或者数组内部的值。

最佳实践

到此,相信大家对“JavaScript的var,let和const有什么区别”有了更深的了解,不妨来实际操作一番吧!这里是亿速云网站,更多相关内容可以进入相关频道进行查询,关注我们,继续学习!

推荐阅读:
  1. JavaScript中let、var和const的区别有哪些
  2. var,let,const的异同点有哪些

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

javascript var let

上一篇:Vue组件传值怎么实现

下一篇:Vue.js前端路由和异步组件实例代码分析

相关阅读

您好,登录后才能下订单哦!

密码登录
登录注册
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》