一、js的作用域
1、全局变量：函数外声明的变量，称为全部变量
局部变量：函数内部使用var声明的变量，称为局部变量
在JS中，只有函数作用域，没有块级作用域！！！也就是说，if/for等有{}的结构体，并不能具备自己的作用域。
所以，函数外部不能访问函数内部局部变量（私有属性）。因为，函数内部的变量，在函数执行完毕以后，就会被释放掉。
if (true) {
var x = 'hello'
}
for (var i = 0; i < 10; i++) {
}
console.log(i)//10
console.log(x)//hello
function test () {
var test2 = 'word'
}
test()
//console.log(test2)//test2 is not defined
2、使用闭包，可以访问函数的私有变量
JS中，提供了一种“闭包”的概念：在函数内部，定义一个子函数，子函数可以访问父函数的私有便利。可以在子函数中进行操作，最后将子函数通过return返回
function func () {
let num = 123
function func2 () {
return num
}
return func2
}
let num1 = func()()
console.log(num1)//123
3、闭包的作用：
①可以在函数外部访问函数的私有变量
②让函数内部的变量可以始终存在于内存中，不会再函数调用完成后立即释放。
二、全局变量的问题
var lis = document.getElementsByTagName("li");//长度为5
for(var i=0; i<lis.length;i++){
lis[i].onclick = function(){
alert(i);//全部是5
}
}
产生问题的原因：
代码从上自下，执行完毕后，li的onclick还没有触发，for循环已经转完！
而for循环没有自己的作用域！所以循环5次，用的是同一个全局变量i！也就是在for循环转完后，这个全局变量已经变成了5，那么点第几个都会是5
解决方案：
1.闭包
函数具有自己的作用域，在for循环转一次，创建一个自执行函数。在自执行函数中，都有自己独立的i，而不会被释放掉。所以for循环转完以后，创建的5个自执行函数的作用域中，分别储存了5个不同的i变量。
var lis = document.getElementsByTagName("li")
for(var i=0; i< lis.length; i++){
(function (i) {
lis[i].onclick = function () {
console.log(i)
}
})(i)
}
2.let声明循环变量
let具有自己的块级作用域，所以for循环转一次，创建一个块级作用域，思路与闭包相同
var lis = document.getElementsByTagName("li")
for(let i=0; i< lis.length; i++){
lis[i].onclick = function () {
console.log(i)
}
}
3.添加index属性通过this获取
出错的原则在于全局变量i在多次循环后被污染。那么在点击事件中，就可以不使用i变量，通过添加的index属性来获下标。
var lis = document.getElementsByTagName("li")
for(var i=0; i< lis.length; i++){
lis[i].index = i
lis[i].onclick = function () {
console.log(this.index)
}
}
