区别一:let和const声明形成块作用域
问题1:var和let在for循环中的区别?
例子1:变量为var
for(var i = 0;i < 4;i++) {
setTimeout(function(){
console.log(`第${i}个`)
},0)
}
结果: 4,4,4,4
。
分析:
每次for
循环的时候setTimeout
都会执行并被放入任务队列,但是里面的function
则不会执行,只有主线上的全部执行完才会执行任务队列里的任务。所以当主线程for
循环执行完之后i
的值为4
,这个时候再去任务队列中执行任务,i
全部为4
。
例子:变量为let
for(let i = 0;i < 4;i++) {
setTimeout(function(){
console.log(`第${i}个`)
},0)
}
结果:0,1,2,3
分析:
因为let i
的是区块变量,每个i
只能存活到大括号结束,并不会把后面的for
循环的 i
值赋给前面的setTimeout
中的i
;而var i
则是局部变量,这个i
的生命周期不受for
循环的大括号限制;
问题2:作用域外获取不到值
if(1){
var a = 100;
let b = 10;
}
console.log(a); // 100
console.log(b) // 报错:b is not defined ===> 找不到b这个变量
区别二:var声明的变量会挂载在window上,而let和const声明的变量不会
var a = 100;
console.log('var a =',a,window.a); // 100 100
let b = 10;
console.log('let b =',b,window.b); // 10 undefined
const c = 1;
console.log('const c =',c,window.c); // 1 undefined
区别三:var声明变量存在变量提升,let和const不存在变量提升
console.log(a); // undefined ===> a已声明还没赋值,默认得到undefined值
var a = 100;
console.log(b); // 报错:b is not defined ===> 找不到b这个变量
let b = 10;
console.log(c); // 报错:c is not defined ===> 找不到c这个变量
const c = 10;
区别四:同一作用域下let和const不能声明同名变量,而var可以
var a = 100;
console.log(a); // 100
var a = 10;
console.log(a); // 10
let a = 100;
let a = 10;
// 控制台报错:Identifier 'a' has already been declared ===> 标识符a已经被声明了。
区别五:暂存死区
var a = 100;
if(1){
a = 10;
//在当前块作用域中存在a使用let/const声明的情况下,给a赋值10时,只会在当前作用域找变量a,
// 而这时,还未到声明时候,所以控制台Error:a is not defined
let a = 1;
}
区别六:const定义的值不能被修改
const a = {name:'李白'};
const a = {};
console.log(a) // 报错:Uncaught SyntaxError: Identifier 'a' has already been declared
注意: 引用类型数据,是可以改变属性的值
const a = {name:'李白'};
a.name = '李大爷';
console.log(a)