块级作用域

JS

• 使用let声明的变量每个块级之间是相互独立的不同变量
  • 每次 for 循环迭代时，用 let 声明的变量 i 都是彼此独立的，并且在每次迭代中是不同的变量
• child::ES5实现块级作用域

实例

为了更好地理解这个机制，下面是一个简单的示例：

for (let i = 0; i < 3; i++) {
    setTimeout(function() {
        console.log(i);
    }, 1000);
}

在这个示例中，由于使用了 let，每次迭代中的 i 都是独立的，因此输出结果将是：

0
1
2

与此相反，如果使用 var，则会得到不同的结果，因为 var 具有函数作用域（或全局作用域），而不是块作用域：

for (var i = 0; i < 3; i++) {
    setTimeout(function() {
        console.log(i);
    }, 1000);
}

在这种情况下，输出结果将是：

3
3
3

这是因为在所有定时器回调函数执行时，i 的值已经变成了 3，即循环结束后的值。

综合示例

for (var i = 0; i < 5; i++) {
    setTimeout(function () {
        console.log(i)
    }, i * 1000)
}

• 将会在 第0秒到第4秒每隔一秒输出5个5
• 解释:
  • 每次循环, i为不同的值, 把值传给setTimeout的第二个参数
  • 执行settimeout的回调函数时, 通过i这个变量获取值的时候, 因为每次循环的i都是统一个地址, 所以值是最好的5