let关键字

r囧r小猫 2022-06-12 07:21 150阅读 0赞

# let关键字 #

引入let的原因正是var的局限性，相比于var，let有以下几点优势：

## 1. 作用域 ##

`var`的作用域是会提升的，`var`声明的变量只能是全局的或者是整个函数块的。

`let`则允许声明一个作用域被限制在块级中的变量、语句或者表达式。

for(var i = 0; i < 5; i++) {
    
    }
    console.log(i);

上面的代码中使用的是`var`，那么最终的输出结果将会是5，因为i虽然是在for循环中声明的，但是作用域会被提升到函数块的边界或者直至全局。

但是如果使用的是`let`，将会报错：

![let1\]!\[(E:\\JavaScript\\Note\\image\\let1.PNG)][let1_E_JavaScript_Note_image_let1.PNG]

这是因为在这里声明的i被局限于for循环这个块中，出了这个块自然就找不到i这个变量了。

需要注意的是，在程序的顶层，let并不会像var那样将声明的变量加到全局对象上去：

![let2\]!\[(E:\\JavaScript\\Note\\image\\let2.PNG)][let2_E_JavaScript_Note_image_let2.PNG]

但是。。在nodejs中var声明的变量也没有加到全局对象上，？？？

let t1 = 0;
    var t2 = "???";
    console.log(this.t1);//undefined
    console.log(this.t2);//undefined

这点以后再仔细追究。

## 2. 对let块级作用域的使用： ##

打印出li的序号：

如果使用var来定义循环控制变量

var oLi =document.getElementById('test').getElementsByTagName('li');
    
            for(var i = 0; i < oLi.length; i++) {            
                oLi[i].onclick =function(event) { 
                    console.log(i);
                }
            }

那么在点击时输出的结果将会是相同的，都是li的个数。

如果使用let

var oLi =document.getElementById('test').getElementsByTagName('li');
    
            for(let i = 0; i < oLi.length; i++) {            
                oLi[i].onclick =function(event) { 
                    console.log(i);
                }
            }

那么最终输出的结果将会是正确的。

这是为什么呢？

因为var声明的i对应的是全局变量，也就是说i是在循环之外存在的。所以每次点击都对应同一个i，而i是全局的，所以在循环结束后，i的值就已经确定了，因此每次点击出来的都是一样的。

但是如果使用了let，那么使用的将是块级作用域，也就是说，每个点击事件都会进入一个不同的块，所以每个点击都会输出正确的序号。

这些就是现在我对let关键字的理解了，如果以后还有新的理解会继续添加进来。

[let1_E_JavaScript_Note_image_let1.PNG]: /images/20220612/e46dbf0b177e43339c44efc33213b3ef.png
[let2_E_JavaScript_Note_image_let2.PNG]: /images/20220612/47fe78b0882a4823b1345220cb4313e6.png