范围和异步JavaScript

Question

我最近在工作中遇到了一个问题，至少根据我对JavaScript的了解，我得到了一个不可能的结果。我希望有人可以解释这里发生的事情，以及为什么实际结果与我的预期结果不同。

控制台中的预期结果

id: a , x: 1
id: b , x: 1
id: c , x: 1

控制台中的实际结果

id: c , x: 1
id: c , x: 2
id: c , x: 3

代码

function MyClass(id)
{
    var x = 0;

    return function()
    {
        return function()
        {
            x += 1;
            console.log("id: ", id, ", x: ", x);
        }
    }
}


function DoStuff(id)
{
    var q = MyClass(id);
    response_callback = q();
    setTimeout(function(){ response_callback(); }, 50);
}

DoStuff("a");
DoStuff("b");
DoStuff("c");

Answer 1

response_callback = q();

此。您没有在任何范围内声明 response_callback ，因此它隐含在全局范围内...

这意味着每次拨打DoStuff()时都会覆盖它。你认为你获得了三个不同的功能并被召唤，但只有一个......

 var response_callback = q(); // should set you back on track

当然，你现在拥有这种结构的方式有点浪费MyClass能够返回一个返回函数的函数。你实际上可以写：

function DoStuff(id)
{
  var q = MyClass(id);
  // ... do other strange and horrible things with q ...
  setTimeout(q(), 50);
}

...并且在没有不必要的关闭的情况下看到相同的结果。