ES6的let和var声明变量的区别
关于let的描述
let
允许你声明一个作用域被限制在块级中的变量、语句或者表达式。与var关键字不同的是,它声明的变量只能是全局或者整个函数块的。
作用域规则
let
声明的变量只在其声明的块或子块中可用,这一点,与var
相似。二者之间最主要的区别在于var
声明的变量的作用域是整个封闭函数,是全域的 。
function varTest() { var x = 1; if (true) { var x = 2; // 同样的变量! console.log(x); // 2 } console.log(x); // 2 } function letTest() { let x = 1; if (true) { let x = 2; // 不同的变量 console.log(x); // 2 } console.log(x); // 1 }
var存在变量提升现象,而let不存在
- 浏览器在运行代码之前会进行预解析,首先解析函数声明,定义变量,解析完之后再对函数、变量进行运行、赋值等。
- 不论var声明的变量处于当前作用域的第几行,都会提升到作用域的头部。
- var 声明的变量会被提升到作用域的顶部并初始化为undefined,而let声明的变量在作用域的顶部未被初始化。
// var 的情况 console.log(foo); // 输出undefined var foo = 2; //相当于 var foo; //声明且初始化为undefined console.log(foo); foo=2;
// let 的情况 console.log(bar); // 报错ReferenceError let bar = 2; //相当于在第一行先声明bar但没有初始化,直到赋值时才初始化
只要块级作用域内存在let命令,它所声明的变量就“绑定”这个区域,不再受外部的影响。总之,在代码块内,使用let命令声明变量之前,该变量都是不可用的,尽管代码块外也存在相同全局变量。
var tmp = 123; if (true) { tmp = 'abc'; // ReferenceError let tmp; } alert(tmp); //输出值为123,全局tmp与局部tmp不影响
let不允许在相同作用域内,重复声明同一个变量。
// 报错 function () { let a = 10; var a = 1; } // 报错 function () { let a = 10; let a = 1; }
var在相同作用域内,可以重复声明同一变量
// 表示重新赋值 function () { var a = 10; var a = 1; }
了解更多关于let的特性、模仿私有接口、暂存死区等
参考整理来源:
https://blog.csdn.net/zuiziyoudexiao/article/details/76890102