使用thunk:为什么我的代码不是按顺序打印的?

时间:2017-11-10 17:13:55

标签: javascript asynchronous thunk asynchronous-javascript

我试图了解thunk。我正在通过Kyle Simpson在Lynda上重新思考异步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.

为什么我的期望不正确?

1 个答案:

答案 0 :(得分: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 再次一个,因此第一个函数执行两次。

要解决此问题,您可能希望通过推送到非突变concat来更改修改:

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