使用 thunk：为什么我的代码没有按顺序打印？

Question

我正在尝试理解 thunks。我正在学习 Kyle Simpson 在 Lynda 上的 Rethinking Async JS 课程。

我有这个代码：

function makeThunk(fn) {
    var args = [].slice.call(arguments, 1);
    return function(cb) {
        args.push(cb);
        fn.apply(null, args);
    }
}

function addAsync(x,y, cb) {
    setTimeout(function() {
        cb(x+y);
    }, 1000);
}


var thunk = makeThunk(addAsync, 10,15);

现在，当我执行以下命令时：

thunk(function(sum) {
    console.log(sum * sum);
})

thunk(function(sum) {
    console.log(sum);
})

结果是625打印了两次

然而，当我执行

thunk(function(sum) {
    console.log(sum);
})
thunk(function(sum) {
    console.log(sum * sum);
})

结果25执行了两次

在第一种情况下，我的期望是先打印 625，然后再打印 25。在第二种情况下，先打印 25，然后再打印 625。

为什么我的预期不正确？

Answer 1

var thunk = makeThunk(addAsync, 10,15);

关闭后的args数组为：

[10, 15]

现在如果你调用 thunk :

thunk(function one(sum) {
console.log(sum * sum);
})

内部参数是：

[10, 15, one]

并且函数是第一次执行。然后你打电话：

thunk(function two(sum) {
  console.log(sum);
})

所以 args 看起来像这样：

[10, 15, one, two]

所以 addAsync 的调用方式如下：

addAsync(10, 15, one, two)

所以cb又是一个，因此第一个函数执行了两次。

要解决此问题，您可能需要通过推送更改修改为非可变连接：

return function(cb) {
    fn.apply(null, args.concat(cb));
}

使用 thunk：为什么我的代码没有按顺序打印？

Using thunks: Why isn't my code printing sequentially?

javascript

asynchronous

thunk

asynchronous-javascript