javascript for 循环中嵌套 setTimeout 的作用域正确输出
延时 100ms 后, 延时中的i 是 传入 的参数
function fn1(i){
setTimeout(function () {
console.log( i,'fn2');
}, 100);
}
fn1 中的i是函数中的参数变量,fn1中的i不会因为fn2中i的值变化而变化
function fn2() {
for (var i = 0; i < 5; i++) {
fn1(i)
}
}
fn2(); // 0 1 2 3 4
fn3 中 相当于 循环5遍, 创建5个延时函数, 这个延时函数还没有执行
等循环完成后, 100ms后, 执行延时函数,
这是i的值要从变量i中取值,
此时, i === 5, 所以输出 5
function fn3() {
for (var i = 0; i < 5; i++) {
setTimeout(function () {
console.log( i,'fn3');
}, 100);
}
}
fn3(); // 5 5 5 5 5
let允许你声明一个作用域被限制在 块级中的变量、语句或者表达式。
与 var 关键字不同的是, var声明的变量只能是全局或者整个函数块的。
var 和 let 的不同之处在于let是在编译时才初始化
for循环还有一个特别之处,就是设置循环变量的那部分是一个父作用域,而循环体内部是一个单独的子作用域。
也就是for语句每次循环所要建立环境的步骤,拷贝所有的变量名称与值到下个循环执行
这个改进主要是为了要解决在for语句中的闭包结构的问题
function fn4() {
for (let i = 0; i < 5; i++) {
setTimeout(function () {
console.log( i,'fn4');
}, 100);
}
console.log(i) // Uncaught ReferenceError: i is not defined
}
fn4(); // 0 1 2 3 4