javascript 闭包是如何处理父函数中 let 形成的块级作用域中的变量呢？

问题描述

问 题

function test(){
  var arr = [];
  for(var i = 0;i < 10;i++){
    arr[i] = function(){
      return i;
    };
  }
  for(var a = 0;a < 10;a++){
    console.log(arr[a]());
  }
}
test(); // 连续打印 10 个 10

为什么把上面第三行代码的 var i = 0 改为 let i = 0 后，调用 test() ，就会打印 1到9 了呢？

javascript 闭包是如何处理父函数中 let 形成的块级作用域中的变量呢？

解决方案

当你用var的时候，如下：

函数1作用域
for(var i = 0; i < 10; i++) { 函数1作用域
        我在函数1作用域中
        arr[i] = function() { 函数2作用域
          我在函数2作用域中
          return i;
        };
}
函数1作用域
console.log(i); 毫无疑问，执行到这里的时候，i是10，既然这里是10
                那么在函数2作用域中访问i也是10也就不足为奇了
                因为函数2作用域中没有，向上去函数1作用域中找
                同一作用域中同一变量名的变量值肯定是相同的(未修改的情况下)

--------------------------分界线-------------------------
当你用let的时候，如下：

块1作用域
for(let i = 0; i < 10; i++) { 块2作用域
    我在块2作用域中
    console.log(i); // 毫无疑问，这里的i从0依次增加到10  
    arr[i] = function() { 块3作用域
      我在块3作用域中
      return i;
    };
}
块1作用域

当你换成let的时候，读取i的时候，在当前作用域（块3）中没有找到，向上一个作用域（块2）寻找，在块2中发现i，于是拿到值。

。

这篇关于javascript 闭包是如何处理父函数中 let 形成的块级作用域中的变量呢？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！