javascript - return 语句在这个闭包中起什么作用?

标签 javascript

function buildFunctions(){
    var arr = [];

    for (var i = 0; i < 3; i++){
        (function(j){
            arr.push(function(){
                console.log(j);
            });
        })(i);
    }   

    return arr;
}

在上面的函数中,每次运行 for 循环时,都会为 IIFE 创建一个新的执行上下文(在 for 循环内部调用)。然后,在 IIFE 内部,它将把一个函数插入数组内部。下一次 for 循环运行时,它将再次创建一个新的执行上下文,以便再次调用 IIFE。

我的问题是第一次调用 IIFE 的执行上下文会发生什么?它仍然存在于内存中还是从执行堆栈中弹出?由于 IIFE 内部没有 return 语句,因此对于 for 循环中对 IIFE 的每次调用,将存在三个彼此叠置的执行上下文堆栈。

然后我假设当 return arr;buildFunctions 中调用时,IIFE 的这三个执行上下文弹出的时间正确吗?

最佳答案

这就是发生的事情:

当您执行var someVar = buildFunctions()时,它将向someVar分配一个由3个不同匿名函数组成的数组。

每个都有自己的上下文,其中 j 的值分别等于 0、1 和 2。

  • 如果您调用 someVar[0]();,它将输出 0
  • 如果您调用 someVar[1]();,它将输出 1
  • 如果您调用 someVar[2]();,它将输出 2

在这里,您可以在 chrome 控制台中看到数组和 someVar[0] 的闭包,其中 j = 0:

enter image description here

关于javascript - return 语句在这个闭包中起什么作用?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33322373/

相关文章:

javascript - AngularJS ng-mouseenter 不能在子 div 中工作

javascript - IE 不会用 Javascript 拆分字符串

javascript - 使用 jquery 表情符号插件时,componentDidMount 的行为与 useEffect 不同

javascript - AngularJS/JavaScript 从另一个对象创建新对象

javascript - 你如何遍历 JavaScript 伪类中的所有方法,而不管它们是否被标记为可枚举?

javascript - 如何在 body 的输入元素上委托(delegate) 'change' 事件?

javascript - 使用 Javascript CSS 在菜单中突出显示当前 PHP 页面

php - 从像素数组创建图像服务器端

javascript - 单击时重新加载或刷新 Div 的脚本

javascript - 更改所有标签的属性