代码之家  ›  专栏  ›  技术社区  ›  Robin-Hoodie

理解经典的执行上下文示例

  •  3
  • Robin-Hoodie  · 技术社区  · 9 年前

    所以我在读这个 blog 关于javascript中的执行上下文。之后,我试图理解一个典型的closure/EC示例:

    http://jsfiddle.net/s3kpmz33/

    function foo() {
        var foos = [];
           for(var i = 0; i < 3; i++) {
              foos.push(function() {
                 alert(i);
               });
           }
        return foos;
    }
    
    var foos = foo();
    
    foos[0]();
    foos[1]();
    foos[2]();
    
    //All alert 3 
    

    我想,如果我正确理解了这一点, i 是3,因为关闭。在函数执行时,它们将在当前范围之外 foo 的作用域,找到变量i,他们发现在执行时它是3。

    然后我就这样解决了:

    http://jsfiddle.net/s3kpmz33/2/

    function foo() {
        var foos = [];
           for(var i = 0; i < 3; i++) {
               (function bar(k) {
                   foos.push(function _bar() {
                      alert(k);
                   })
               })(i);
           }
        return foos;
    }
    
    var foos = foo();
    
    foos[0]();
    foos[1]();
    foos[2]();
    
    //Correctly alert 0, 1, 2
    

    现在,我相信这背后的原因是因为 _bar 函数现在查找 bar 函数作用域,因为这是一个iife,或者任何可以用我想要的值执行的函数(例如@Quentin指出的先前声明的函数),他们都创建了自己的本地副本 并将其分配给局部变量 k .

    我的假设正确吗?我意识到我可能解释得不太清楚,因为我觉得自己不够理解。如果我在推理中犯了错误,请纠正我。

    如果你能用更简单的话来提高我的推理能力,这对我和任何来这里寻找答案的程序员同事来说也是非常感激的。

    1 回复  |  直到 9 年前
        1
  •  3
  •   Quentin    9 年前

    因为这是一种生活

    它不需要是IIFE。您可以改为调用先前声明的函数。

    function alerter_factory(value_to_alert) {
      return function() {
        alert(value_to_alert);
      }
    }
    
    function foo() {
      var foos = [];
      for (var i = 0; i < 3; i++) {
        foos.push(alerter_factory(i));
      }
      return foos;
    }
    
    var foos = foo();
    
    foos[0]();
    foos[1]();
    foos[2]();

    他们都创建了自己的i本地副本,并将其分配给本地变量k。

    他们有自己的本地副本 价值 那是在 i 分配给本地 k 变量