返回延迟对象的链接函数

Question

我有一些函数会返回 jQuery Deferred 对象，但我无法将它们链接起来并处理结果。

考虑以下示例：

const start = Date.now();

// Print a message with a timestamp.
function log (v) {
    console.log(`${Date.now() - start} ${v}`);
}

// Return a deferred function that resolves 1 second later with 'value'.
function test (value) {
    log(`test(${value})`);
    return $.Deferred(function (def) {
        window.setTimeout(function () {
            log(`resolve(${value})`);
            def.resolve(value);
        }, 1000);
    });
}

// Example:
test(42)
    .then(function (v) { log(v); })
    .then(test(99))
    .then(function (v) { log(v); })
    .then(function () { log('done'); });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

这是应该运行test(42)，然后对其结果做一些事情，然后运行test(99)，然后对这些结果做一些事情，一切都按顺序进行。但是，它实际上输出（第一个数字是自程序启动以来的 ms）：

0 test(42)
0 test(99)
1003 resolve(42)
1003 42
1003 undefined    <-- supposed to be 99
1005 done
1005 resolve(99)

因此，两个tests 在开始时同时被调用，而其他一切都关闭了。我想要它输出的是这样的：

0 test(42)
1000 resolve(42)
1000 42
1000 test(99)
2000 resolve(99)
2000 99
2000 done

我怎样才能做到这一点？我尝试返回$.Deferred(...).promise()，但行为没有改变，我也尝试使用done而不是then，但唯一的变化是它第二次打印42而不是undefined。

Answer 1

每个延迟只解决一次。对于每个延迟链，您必须正确附加它们。此外，第二次调用 test 需要在一个函数中，这样它就不会立即执行。

const start = Date.now();

// Print a message with a timestamp.
function log (v) {
    console.log(`${Date.now() - start} ${v}`);
}

// Return a deferred function that resolves 1 second later with 'value'.
function test (value) {
    log(`test(${value})`);
    return $.Deferred(function (def) {
        window.setTimeout(function () {
            log(`resolve(${value})`);
            def.resolve(value);
        }, 1000);
    });
}

// Example:
test(42)
    .then(function (v) { log(v); })
    .then(function () {
        test(99)
           .then(function (v) { log(v); })
           .then(function () { log('done'); });
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>