返回函数的Javascript范围错误函数[重复]答案

【问题标题】：Javascript scoping error function that returns functions [duplicate]返回函数的Javascript范围错误函数[重复]
【发布时间】：2013-05-01 23:14:29
【问题描述】：

这是我的函数的简化版本。问题是我在警报中都得到了 2 次。我相信这是一个变量范围问题，但我似乎无法弄清楚。

var someObj = {"a" : 1, "b" : 2};

function getData(obj){
  var bunchOfFunctions = {};  
    for(var key in obj){
      value = obj[key];
        bunchOfFunctions[key] = function(){
            alert(value);
        }
    }
  return bunchOfFunctions;
}

var functs = getData(someObj);
for(var key in functs){
    functs[key]();
}

这是一个 jsfiddle http://jsfiddle.net/earlonrails/q4d66/

【问题讨论】：

标签： javascript node.js scope

【解决方案1】：

Fiddle以下答案

你必须更换

  value = obj[key];
  bunchOfFunctions[key] = function(){
      alert(value);
  }

与：

  value = obj[key];
  bunchOfFunctions[key] = (function(value) { return function() {
      alert(value);
  } })(value)

这是因为value 变量一直在变化，所以一旦循环运行完毕，value 就是 2。这段代码所做的就是用value 调用一个函数，然后该函数返回另一个函数。然而，它返回的另一个函数现在具有正确的value，因为它在自己的范围内。

【讨论】：

Thnx 人很好的答案！也喜欢 Pointy's 但你有一个我喜欢的工作小提琴！

【解决方案2】：

这是一种范围问题。问题是束中的每个函数共享相同的变量“值”。在您的情况下，您忘记使用var 声明“值”，因此它是一个全局变量。

但是，即使您确实使用了var，也会遇到同样的问题。

诀窍是通过将函数的创建包装在另一个函数中来引入新的范围层。

    bunchOfFunctions[key] = function(valueCopy) {
      return function() {
        alert(valueCopy);
      };
    }(value);

【讨论】：

【解决方案3】：

包含alert语句的函数运行时，只看到for语句最后一次交互的值

避免这个问题的解决办法是：

var someObj = {"a" : 1, "b" : 2};

function getData(obj){
  var bunchOfFunctions = {};  
  for(var key in obj){
    var value = obj[key];
    bunchOfFunctions[key] = (function(x){
        return function() {
            alert(x);
        }
    })(value)
  }
  return bunchOfFunctions;
}

var functs = getData(someObj);
for(var key in functs){
   functs[key]();
}

【讨论】：