标签：ati undefined not alert ESS 作用 for 产生 方式
在es6中除了var还可以用let申明变量，并且建议使用let而不要再使用var，两者有以下区别：
1.let不能重复声明变量
var name = ‘tom‘;
var name = ‘jack‘;
console.log(name);
输出：jack。不会报错
let name = ‘tom‘;
let name = ‘jack‘;
console.log(name);
报错，Identifier ‘name‘ has already been declared
2.let申明的变量不会做预处理变量提升
console.log(name);
var name = ‘tom‘;
输出：undefined。不会报错
console.log(name);
let name = ‘tom‘;
报错，Cannot access ‘name‘ before initialization
3.let只在块级作用域内有效
if(true){
var name = ‘tom‘;
}
console.log(name );
输出：tom
if(true){
let name = ‘tom‘;
}
console.log(name );
报错，name is not defined
这个特性可以在循环遍历加监听的时候十分好用。比如这样一个需求，有n个button，在点击button的时候输出这个button的下标是第几个
当使用var的时候：
let btns = document.getElementByTagName(‘button‘);
for(var i =0;i<btns.length;i++){
var btn = btn[i];
btn.onclick=function(){
alert(i);
}
}
输出：不管点击那个button输出的都是最后一个button的下标，因为for循环是在我们点击按钮之前就已经全部执行完了的，而使用var没有块级作用域，也就是是说所有的i都是一个，它的值就是最后一次循环i的值。以前解决这个问题是使用闭包的方式：
let btns = document.getElementByTagName(‘button‘);
for(var i =0;i<btns.length;i++){
var btn = btn[i];
function(i){
btn.onClick=function(){
alert(i);
}
}(i);
}
这种方式的原理是，每一次循环都会生成一个函数，而在btn.onClick=function(){alert(i);}声明的回调函数里面使用了外部函数的变量i所有产生了闭包，将当前的i保存起来，在后面回调函数出发的时候打印的就是当前闭包中保存的i；
如果用let来申明i则可以简单解决这个问题：
let btns = document.getElementByTagName(‘button‘);
for(let i =0;i<btns.length;i++){
var btn = btn[i];
btn.onclick=function(){
alert(i);
}
}
因为每次循环都有一次块级作用域产生，而用let声明的变量只能在当前的块级作用域中使用，所以最后回调的时候使用的i就是当前循环次数下的块级作用域下的i，就不会向var声明一样，使用的都是同一个i了。
标签：ati undefined not alert ESS 作用 for 产生 方式
原文地址：https://www.cnblogs.com/maycpou/p/12325586.html
