JavaScript专题之闭包必考题

题目：问控制台打印输出的结果

for (var i = 0; i < 10; i++) {
    //定时器是异步编程：每一轮循环设置定时器，无需等定时器触发执行，继续下一轮循环(定时器触发的时候，循环已经结束了)
    setTimeout(() => {
        console.log(i)  //10
    }, 1000)
}

需求： 让每一轮循环输出当前的i值
实现代码：
1.修改let，形成块级作用域

for (let i = 0; i < 10; i++) {
    //  let存在块级作用域，每一次循环都会在当前块作用域中形成一个一个私有变量i存储0-9
    //当定时器执行的时候使用的i就是所处块作用域中的i
    setTimeout(() => {
        console.log(i)  
    }, 1000)
}

2.使用闭包

for(var i = 0; i < 10; i ++) {
    (function (i) {  //私有变量i
        setTimeout(() => {
            console.log(i)  
        }, 1000)
    })(i) //将外部的i传入
}

闭包的另一种写法：

for (var i = 0; i < 10; i ++) {
    // setTimeout(((i) => {})(i), 1000)，在{}中传入函数
    
    // setTimeout(((i) => {
    //     return () => {
    //         console.log(i)
    //     }
    // })(i), 1000)
    // 简写
    setTimeout((i => () => console.log(i))(i), 1000)
}

3.可以基于bind的预先处理机制: 在循环的时候就把每次执行函数需要输出的结果，预先传给函数

//也可以把函数放外面
// var fn = function(i) {
//     console.log(i)
// }
for(var i = 0; i < 10; i ++) {
    var fn = function(i) {
        console.log(i)
    }
    setTimeout(fn.bind(null, i),1000)
}