ES6——Day1（let用法）

缺乏、安全感 2022-07-16 17:12 180阅读 0赞

1、基本用法

ES6新增了let命令，类似于javascript中的var命令

注意：它所声明的变量，只是在let命令所在的代码块有效。

<!DOCTYPE HTML>
    <html lang="en">
    <head>
    <meta charset="utf-8">
    <title>let用途</title>
    <script src="../../../vendor/traceur.js"></script>
    <script src="../../../vendor/bootstrap,js"></script>
    <script type="text/traceur">
     var a=100;
     let=200;
     console.log(a);      //100
     console.log(b);      //200;
    
    </script>
    </head>
    <body>
    
     ...
    </body>
    </html>

案例解析：var可以用作全局变量，而对于let而言只能用作局部变量，只能在let所在的代码块有效。

如下所示：let只在代码块内部有效，其他的表现为undefined。

2、let不存在变量提升

（1）在ES5中

console.log("ES5:");
    var a=[];
    for(var i=0;i<10;i++){
     var c=i;
     a[i]=function(){
     console.log(c);
     };
    };
    a[5]();

结果：9

解析：由于var i作为一个全局变量，在for循环体中，i赋值给c，循环结束时，c=9，

即在console中，显示c的值“9”

（2）在ES6情况下

console.log("ES6:");
    var b=[];
    for(var j=0;j<10;j++){
    	let d=j;
    	b[j]=function(){
    		console.log(d);
    	};
    };
    b[5]();

结果：5

解析：由于在for循环体中，j逐步加1，但是在let外部，是不影响的，输出b\[j\]，j=5，let d，仅在let局部作用域代码块有效，即console.log(d),d=j=5。

（3）暂时性死区

只要块级作用域内存在let命令，它所声明的变量就“绑定”这个区域，不再受外部的影响。

a、无外界影响的情况

{
     console.log(a);   //undefined；
     let a=100;
     console.log(a);   //100
    }

注意：在let定义变量之前，所在的区域称为“暂时性死区”，前边未定义即表示“undefined”

b、有外界影响的情况

var a=100;
    {
    	console.log(a);   //undefined；
    	let a=100;
    	console.log(a);   //100
    }

在上述代码中，var a=100，表示的是在定义作用域之外的东西，即外界的东西。

但是对于let所在的作用域会绑定内部，即外部对它并不会造成什么太大的影响，结果与上述案例相同。

（4）不允许重复声明

a、模块内部不允许重复声明

{
     var a=100;
     var a=200;
    }
    console.log(a); //200
    {
     var b=100;
     let b=200;
    }
    console.log(b);
    {
     let c=100;
     var c=200;
    }
    console.log(c);
    {
     let d=100;
     var d=200;
    }
    console.log(d);

在上述案例中，只有第一个有效。即“var可以重复说明”。

对于let而言，无论let在块级作用域中，先定义还是后定义，定义一个还是定义两个，都会显示错误，即表示对于let这个声明变量并不能在模块内重复声明。

b、模块之间是可以重复声明

{
     var a=100;
     var a=200;
     console.log(a);
    }
    {
     let a=300;
     console.log(a);
    }
    {
     //模块内部不允许用let重复声明
     var a=1;
     let a=2;
    }

注意：不可以用let重复声明。