let、const与var主要有以下几点区别
1, 重复声明:
已经存在的变量或常量,var 是允许重复声明的,let、const不允许
let a = 1;
let a = 2;
// 此时,js会报错 Uncaught SyntaxError: Identifier 'a' has already been declared
function test(f) {
let f = 1; // 此时同样会报错, 因为f这个变量已经在形参中定义了
}
// const和let同理,就不再写了!
var b = 3
var b = 4
console.log(b); // 输出 4, 使用var定义 后面的定义变量会覆盖掉前面的定义,
2,变量的提升:
var定义的变量会提升变量的声明的作用域的顶部
console.log(a); // 此时JavaScript并不会报错,并且输出 undefined
var a = 1;
// 上面的代码相当于
var a;
console.log(a);
a = 1;
而let、const不存在变量提升
console.log(a); // 此时let定义的变量,变量的声明并不会提升,这里会直接报错!const同理
let a = 1;
3,暂时性死区
只要作用域中存在let、const,他们声明的变量或常量就自动“绑定”这个区域,不再受外部作用域的影响
let a = 2;
function func(){
console.log(a);
// 此时程序会报错,没有定义a这个变量
// 原因是在这个函数作用域中使用let定义了a这个变量
// 此时外部作用于的a变量就不会影响到内部的作用域了
// 而 let定义的变量是不会自动变量声明提升的
// 所以在函数内部定义 a变量之前使用a变量就会报错
let a = 3;
}
func();
let b = 2;
function func(){
// 此时在func内部使用let定义b变量。则测试将会使用外部作用域的b变量
// 程序正确输出 "2"
console.log(b);
}
func();
4,window对象的属性和方法
在全局作用域中,var声明的变量,通过function声明的函数,会自动变成window对象的属性或者方法
var age = 18;
function add(){}
console.log(window.age) //18
console.log(add === window.add) // trues
let sex = "1";
console.log(window.sex); //undefined 用let声明的变量并不会自动成文window的属性
5,块级作用域(最重要的区别)
// var没有块级作用域
for( var j= 0;j < 3;j++)
{
}
console.log(i); // 3 ,
for(let i = 0;i < 3;i++)
{
}
console.log(i); // 测试会报错,提示i变量没有被定义