ES6新增了两个重要的关键字let和const,无意中翻出了之前的笔记总结了下三者的区别,今天分享给大家(有误之处请指出)。
一、let
我们都知道在javascript中是没有块级作用域的,只有函数和全局工作域,但是let的诞生突破这一局面,let声明的变量只在let命令所在的代码块内有效(圈重点)。
1.let是在代码块内有效,var是在全局范围内有效(上码)
if(true) { let a = '我'; var b = '你'; } console.log("let" + a); //报错:Uncaught ReferenceError: a is not defined console.log("var" + b);
问题来了:当我们想要循环打印出0~9这10个数字的时候,早期时候,我们经常会犯这样的一个错误(错误示例):
for (var i = 0; i < 10; i++) { setTimeout(function(){ console.log(i); }) }
// 输出十个 10
用var声明的变量在全局范围内有效,所以全局只有一个变量i,所以定时器中的i值得是全局变量i,每次循环都是打印同一个i,所以循环结束后,此时的i都为10。解决这个问题(正确示例):
for (var i = 0; i < 10; i++) { (function(i) { setTimeout(function(){ console.log(i); }) })(i) }
我们通过闭包函数来实现,因为冰雹函数,每一次创建都会存在一个自己的空间来存储唯一的值。我们将i的每一次执行for循环的值,传给不同创建的闭包函数,这样每一个闭包函数里存储的i值,就都不会一样.所以就是达到我们的想要的结果. 因为let的块级作用域,我们还可以这样实现:
for (let j = 0; j < 10; j++) { setTimeout(function(){ console.log(j); }) } // 输出 0123456789
2.let不存在变量提升,var存在变量提升
console.log(a); //ReferenceError: a is not defined let a = "我"; console.log(b); //undefined var b = "你";
用 var 声明存在变量提升,当脚本开始运行的时候,b 已经存在了,但是还没有赋值,所以会输出 undefined
3.let不能重复声明,var可以对一个变量声明多次
let a = a; let a = b; var b = c; var b = d; a // Identifier 'a' has already been declared b // d
二、const命令
const声明一个只读变量,声明后是不允许改变,一旦声明就必须初始化,ES6明确规定,代码块内如果存在 let 或者 const,代码块会对这些命令声明的变量从块的开始就形成一个封闭作用域。代码块内,在声明变量 之前使用它会报错。
var a = "a"; if(true){ console.log(a); // ReferenceError: a is not defined const PI = "3.1415926"; }