面试题 - 说说 var、let、const 区别

题目

请描述一下 var、let 、const 三者的区别。

解答

1. 是否存在变量提升

变量提升：变量可以在申明之前使用。

var 声明的变量存在变量提升，全局作用域下是 window 属性。

console.log(a);//undefined,a 变量提升到前面，相当于 var a;a = 10;
var a = 10;

let 和 const 声明的变量没有变量提升。

console.log(a);//报错 Cannot access 'a' before initialization
//变量无法提升;
let a = 10;

console.log(b);//报错 Cannot access 'b' before initialization
//变量无法提升;
const b = 10;

2. 能否重复声明

var 能重复声明。

var a = 10;
var a = 20;
console.log(a)//20

let 和 const 不能重复声明。

let a = 10;
let a = 20;//报错 'a' has already been declared

const b = 10;
const b = 20;//报错 'b' has already been declared

3. 变量值能否修改

var 和 let 声明的值可以修改。

var a = 10;
a = 20;
let b = 10;
b = 20;
console.log(a,b);//20,20

const 声明的值是常量，不能修改。如果申明的是引用类型，可以修改其属性。

const a = 10;
a = 20;//报错 Assignment to constant variable

const b = {val:10};
b.val = 20;
console.log(b);//{val:20}

4. 是否必须设置初始值

var 和 let 声明时可以不用设置初始值。

var a,let b;
a = 10;
b = 20;
console.log(a,b)//10,20

const 声明时必须设置初始值，不能使用 null 占位。

const a;
a = 20;//报错 Missing initializer in const declaration

5. 是否存在块级作用域

块级作用域：申明的变量只在该块级作用域内有效。

var 没有块级作用域

for(var i=0;i<3;i++){
  console.log(i);//0,1,2
}
console.log(i);//3,没有块级作用域，外层也能访问

if(true){
  var a = 10;
}
console.log(a);//10

let 和 const 有块级作用域

for(let i=0;i<3;i++){
  console.log(i);//0,1,2
}
console.log(i);//报错 i is not defined,有块级作用域，外层不能访问

if(true){
  let a = 10;
}
console.log(a);//报错 a is not defined

if(true){
  const b = 10;
}
console.log(b);//报错 b is not defined

6. 是否存在暂时性死区

暂时性死区：只要块级作用域有 let 或者 const 命令，他们所申明的变量就绑定这个区域，不受外部影响。

var 不存在暂时性死区

 var a = 10;
 if(true){
    console.log(a);//10
    var a = 20;
  }

let 和 const 存在暂时性死区

var a = 10;
if(true){
      console.log(a);//报错 Cannot access 'a' before initialization
      let a = 20;
 }
 
var b = 10;
if(true){
      console.log(b);//报错 Cannot access 'b' before initialization
      const b = 20;
 }

总结

区别	var	let	const
是否存在变量提升	是	否	否
是否能重复声明	是	否	否
变量值能否修改	能	能	否
是否必须设置初始值	否	否	是
是否存在块级作用域	否	是	是
是否存在暂时性死区	否	是	是