ES6的let命令

下文来自阅读官方文档的笔记:

基本用法:

ES6新增了let命令,用来声明变量.它的用法类似于var,但是所声明的变量,只在let命令所在的代码块内有效.所谓代码块就是用{}含括起来的独立的一块，但排除if、for、while的{}。

var a = [];
for (var i = 0; i < 10; i++) {
  a[i] = function () {
    console.log(i);
  };
}
a[6](); // 10

咋一看这个小段代码，感觉e[6]()的结果就是6，但是并非如此。for中var i=0；在整个循环运行结束后，就会泄露i为全局变量，代码从上到下的依次执行，当for结束了，i便为10了。执行到a[6]();就是相当于执行 function(){console.log(i)}. 其中的i取的就是全局变量i，也就是10.

再来一个：

<script>

    var a =1;

    function test(){

       alert(a);

       var a = 2;

       alert(a);

    }

    test();

    alert(a);

 </script>

猜猜这个会输出什么？1 2 1 ？很遗憾，正确答案是undefined 2 1

本以为test（）里头的第一个alert（a）取的是外边的var a = 1；为什么突然之间变成了undefined？关键在于它后边的

命令 var a = 2；这个命令把test（）的第一个alert中原本是全局变量的a升级为了局部变量a。这就是所谓的“变量提升现象”。

即变量可以在声明之前使用，值为undefined。test（）中的第二个alert（a）中的a，取的是局部变量var a =2， test（）外边的alert（a）。与var a =1；同在在一个scope（作用域）下，便是1了。

为了纠正这种现象，let命令改变了语法行为，它所声明的变量一定要在声明后使用，否则报错。

如下：

var a = [];
for (let i = 0; i < 10; i++) {
  a[i] = function () {
    console.log(i);
  };
}
 console.log(i);
a[6](); // 6

在外边输出i，显示的未定义i变量，就使用了，使用let必须先声明后使用。et不会在for结束循环后把i泄露为全局变量，i随着for的结束便被清理了。

猜你喜欢