JavaScript ES6中const、let与var的对比详解
ECMAScript6新增const和let命令,用来声明变量。
| 声明方式 | 变量提升 | 作用域 | 初始值 | 重复定义 |
| const | 否 | 块级 | 需要 | 不允许 |
| let | 否 | 块级 | 不需要 | 不允许 |
| var | 是 | 函数级 | 不需要 | 允许 |
变量提升:const和let必须先声明再使用,不支持变量提升
console.log(c1,l1,v1); //报错 //UncaughtReferenceError:c1isnotdefined constc1='c1'; letl1='l1'; varv1='v1';
作用域:const,let支持块级作用域,有效避免变量覆盖
constc21='c21';
letl21='l21';
varv21='v21';
if(0.1+0.2!=0.3){
constc21='c22';
letl21='l22';
varv21='v22';
console.log(c21,l21,v21);
//输出c22l22v22
}
console.log(c21,l21,v21);
//输出c21l21v22
块级作用域,在外层不能直接访问内层变量
if(0.1+0.2!=0.3){
constc22='c22';
letl22='l22';
varv22='v22';
console.log(c22,l22,v22);
//输出c22l22v22
}
console.log(c22,l22,v22);
//报错
//UncaughtReferenceError:c22isnotdefined
//同样地,l22isnotdefined
const定义常量,该常量不能赋值,但该常量的属性可以赋值
constc231={};
constc232=[];
c231.name='seven';
c232.push(27);
console.log(c231,c232);
//输出{name:"seven"}[27]
//禁止给对象赋值,应该使用Object.freeze
constc233=Object.freeze({});
constc234=Object.freeze([]);
c233.name='seven';
//普通模式下不报错
//严格模式下报错
//UncaughtTypeError:Cannotaddpropertyname,objectisnotextensible
c234.push(27);
//普通模式下就会报错
//UncaughtTypeError:Cannotaddproperty0,objectisnotextensible
console.log(c233,c234);
//输出{}[]
全局变量不再设置为顶层对象(window)的属性,有效避免全局变量污染
constc24='c24'; letl24='l24'; console.log(c24,l24); //输出c24l24 console.log(window.c24,window.l24); //输出undefinedundefined
符合预期的for循环
for(vari=0;i!=3;i++){
setTimeout(function(){
console.log(i);
},10);
}
//依次打印
for(leti=0;i!=3;i++){
setTimeout(function(){
console.log(i);
},10);
}
//依次打印,为啥呢
可以看到在for循环中使用let方式声明变量才是符合预期。
在for中每一次循环,let都是重新声明变量,并且因为JavaScript引擎会记住上一次循环的值,初始化i时在上一轮的基础上计算。
可以看到在for循环中至少有两层作用域,看下面的例子更容易理解。
for(leti=0;i!=3;i++){
leti='seven';
console.log(i);
}
console.log('eight');
//依次打印
seven
seven
seven
eight
初始值:const声明的变量必须设置初始值,且不能重复赋值。
constc3='c3'; letl3='l3'; varv3='v3'; console.log(c3,l3,v3); //输出c3l3v3 c3=2;//UncaughtTypeError:Assignmenttoconstantvariable l3=2; v3=2; console.log(c3,l3,v3); //输出c322 constc32; //报错 //UncaughtSyntaxError:Missinginitializerinconstdeclaration
重复定义:const和let不支持重复定义
const、let缩小了变量作用域,完美避免变量污染;const固定变量(即固定变量类型),对于弱类型JavaScript来说,可以明显提升性能。推荐在应用中使用const、let声明变量。
总结
以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作能带来一定的帮助,如果有疑问大家可以留言交流,谢谢大家对毛票票的支持。