一、课程名称：前端工程师2022版
二、课程章节：ES6基础入门-初识ES6(3-12 let 和 const 的应用-慕课网体系课 (imooc.com))
三、课程讲师：Alex
四、课程内容：
题目：标有0、1、2的三个按钮，随意点击哪一个，在控制台可以输出按钮上的数字
（1）使用var时的做法：使用元素选择器获得按钮后，通过for循环嵌套，绑定addEventListener中的点击事件，输出i，但这同时导致无论点击哪个，输出结果都是3，这是因为函数作用域只有在被调用时才产生，此时并没有函数作用域，var定义的是全局变量，在里层作用域找不到，只能去全局找i，函数结束后i的结果只能是3
// 1、var的做法
for (var i = 0; i < btns.length; i++) {
btns[i].addEventListener(
"click",
function () {
console.log(i); //无论点击哪个，输出结果都是3
},
false
);
}
（2）使用闭包的做法：在for循环中，添加一个IIFE，将for循环中原本的语句放在IIFE中，此时内部含有的作用域主要有最内层的函数作用域（由于未被调用而没有产生，直到点击按钮才会产生）、外层IIFE传入的i的函数作用域（该作用域中存在了传入的变量index，值分别等于0，1，2）、全局作用域（其中i的值为3），而当按钮被点击的时候，内层作用域产生，没有在内层寻找到index的值，就向外层寻找，在外层IIFE传入的i的函数作用域中找到了index值，直接输出，而不再往全局作用域寻找
// 2、ES6之前，会采用闭包的方法，添加一个IIFE
for (var i = 0; i < btns.length; i++) {
(function (index) {
btns[index].addEventListener(
"click",
function () {
console.log(index);
},
false
);
})(i);
}
（3）使用let/const的做法：直接将var的语句中两个var改成let就可以了，在这个语句中，全局作用域中没有变量i，在循环的三次中，一共创建了3个块级作用域，等到点击按钮时，就会在各自的块级作用域中创建函数作用域，当执行打印i的语句时，没有在函数作用域中找到，自然会往外层的块级作用域中寻找，可以找到i的值，最后输出i
// 3、使用let/const的做法
for (let i = 0; i < btns.length; i++) {
btns[i].addEventListener(
"click",
function () {
console.log(i);
},
false
);
}
五、课程收获：
今天Alex老师为了讲解let和const在实际开发中的应用，将从前的var做法和闭包的做法重新带我们回顾了一遍，有了前面知识的对比，真正感觉到了let和const的便捷，课后再重复画了一遍老师画的作用域图，知识点更加清晰了，期待后面的课程，加油！
随时随地看视频
