关于let以及var的区别

Posted 2020-08-19

　　最近我在看一些文章的时候总是会出现 let 这个关键字，让我很是不解。于是查了一些资料才了解那么一点....

下面直接进入正题，关于let的定义：let 允许把变量的作用域限制在块级域中。与var的区别在于var 声明要么是全局变量或者是局部变量，而无法变为块级的（还是无法理解块级变量）。

直接上代码：

　　  var list = document.getElementById("list");

　　 for (var i = 1; i <= 5; i++) {

　　　　 var item = document.createElement("LI");

　　　　 item.appendChild(document.createTextNode("Item " + i));

　　　　 let j = i;

　　　　 item.onclick = function (ev) {

　　　　　　console.log("Item " + j + " is clicked.");

　　　　};

　　　　list.appendChild(item);

　　　　};

结果当声明 j 为let的时候，每次点击一个li，每一个li都有自己的事件，输出结果为：ITem1 is clicked，ITem2 is clicked，ITem3 is clicked，ITem4 is clicked，ITem5 is clicked。

而我再次把let j = i换成 var j = i时候，每点击一次li输出结果为：ITem5 is clicked。因为 var  j = i 是局部变量，5个内部函数都指向了同一个 j ,而 j 最后一次赋值是5。而当用let声明后，

j 变成块级域（也就是花括号中的块，每进入一次花括号就生成了一个块级域）,所以 5 个内部函数指向了不同的 j 。