这篇文章主要介绍“JavaScript变量中var,let和const的区别是什么”的相关知识，小编通过实际案例向大家展示操作过程，操作方法简单快捷，实用性强，希望这篇“JavaScript变量中var,let和const的区别是什么”文章能帮助大家解决问题。
JavaScript中一共有3种用来声明变量的关键字，分别是var、let和const。
其中var关键字是ES5时代的产物，由于ES5对变量的约束很宽松，使用var来声明变量时经常会出现一些预料之外的问题。 ES6为了使变量的定义更加规范，提出了let和const这两个关键字。
因此要解释清楚这三个的区别，首先要从ES5时代和ES6时代的差别说起，主要是var和let的区别。
使用不同的关键字来声明变量，主要就是对变量的作用域有不同的限制，因此var和let最主要的区别就是变量作用域的区别。
var声明的范围是函数作用域，函数体之外无法访问到函数体内声明的var变量。
做题的时候经常会有在全局和函数体内声明同名变量的场景，要知道不同作用域的变量是不会互相干扰的。
var a = 10;
function logA() {
var a = 20;
console.log(a); // 20
}
console.log(a); // 10let声明的范围是块作用域，块作用域是函数作用域的子集，可以使用花括号{...}来限定块级作用域。
在全局作用域下使用var和let声明变量，变量都是会在页面的声明周期内存续。
但是使用var声明的变量会成为window对象的属性，使用let声明则不会。
var声明存在变量提升的行为。
变量的声明、初始化和赋值被分为三步进行，对于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;
})();ES6对先访问后声明变量的行为做了约束，因此let和const声明会存在TDZ暂时性死区。
即JavaScript引擎在编译时如果遇到let和const声明，会将它们放入暂时性死区以阻止访问，只有在执行到变量声明的语句后，才会将变量从TDZ中移出。
因此如果在变量声明语句之前访问变量，相当于企图访问TDZ中的变量，JavaScript会抛出运行时错误ReferenceError。
ES5的变量提升和ES6的暂时性死区的区别还有一个“副作用”就是改变了
typeof操作对于变量的访问性。已知在ES5时对于未声明变量唯一的安全操作是
typeof，会返回undefined值。TDZ的出现导致即使使用
typeof，也不能在let和const声明语句执行之前访问let和const变量，依然会报ReferenceError。
var声明是允许重复的，可以重复使用var关键字来声明同名变量，后来声明的变量值会覆盖之前的值。
为了阻止重复声明变量这个容易让人迷惑的行为，ES6限制了let和const声明的变量都是不可重复的，如果重复声明会报SyntaxError错误。
这个限制不仅体现在let声明对let声明，如果想用let去重复声明var变量也是不被允许的。
同样都是ES6的变量声明关键字，let和const的区别就在于使用const声明创建的是一个值的只读引用。
只读引用意味着对于原始值来说，const声明不可以再重新赋值；
对于引用值来说，const声明不可以再修改引用，但是可以修改对象的属性值或者数组内部的值。
尽量不使用var。因为let和const已经可以替代var的位置，满足开发需求，顺便还规避了很多不必要的问题。
优先使用const声明，let声明次之。const声明有点像保护变量的机制，它能预防和阻止预期之外的变量修改。 对于有修改需求的变量，就使用let声明。
关于“JavaScript变量中var,let和const的区别是什么”的内容就介绍到这里了，感谢大家的阅读。如果想了解更多行业相关的知识，可以关注亿速云行业资讯频道，小编每天都会为大家更新不同的知识点。
免责声明：本站发布的内容（图片、视频和文字）以原创、转载和分享为主，文章观点不代表本网站立场，如果涉及侵权请联系站长邮箱：is@yisu.com进行举报，并提供相关证据，一经查实，将立刻删除涉嫌侵权内容。
