Question

我正在努力理解$.when(...).then(...).done(...)。这只是测试。

HTML：

<p id="phrase"></p>
<button id="btn">get phrase</button>

的javascript：

var p = $('#phrase');

function displayResult(o){
    console.log(o);
    p.append(o + ' ');
};

function getSubject(){
    console.log('getSubject');
    return $.get(
    'sujet.js', //returns "the quick brown fox"
    displayResult
    );
}

function getVerb(){
    console.log('getVerb');
    return $.get(
    'verbe.js',//returns "jumps over"
    displayResult
    );  
}

function getComplement(){
    console.log('getComplement');
    return $.get(
    'complement.js', //returns "the lazy dog"
    displayResult
    );
}

function close(){
    p.append("!!!");
}

function load(){
    $.when(getSubject())
    .then(getVerb)
    .then(getComplement)
    .done(close);
}

$('#btn').click(load);

据我了解，它应该：

请求sujet.js，在段落中显示字符串。
请求verbe.js，在段落中显示字符串。
请求complement.js，在段落中显示字符串。
追加“!!!”到段落。

所有这一切都是sujet.js。永远不会调用displayResult，也不会将函数传递给then和done。

所以，我可能误解了一些事情。

我从this answer获得了示例。

修改

我的问题是解析错误，与$.when或$.then无关。一旦修复，其余部分按预期工作。然而，我将梅加尔的答案标记为已被接受，因为它很好地解释了事情是如何起作用的。

Answer 1

$.when(...).then(...).done(...)不是一件事，因为你不需要 when，而你不需要then，而你不需要使用done终止链。只需将您的承诺返回函数与then链接起来，并添加fail处理程序：

getSubject()
.then(getVerb)
.then(getComplement)
.then(close)
.fail(function () {
  console.log("One of the functions failed");
});

请注意，通过省略fail，您基本上缺少使用延迟而不是成功/失败回调的全部好处：使用一种统一的错误处理方法从任何级别“捕获”失败。

Answer 2

只有前一个函数调用返回的.then() / $.Deferred对象获得promist - d或resolve()时，才会调用reject()部分 - 编辑。如果$.get以错误终止，则永远不会被解决或拒绝，并且.then()中的函数调用将永远等待。由于你所看到的，我假设函数$.get中的ajax调用getSubject()以异常方式终止。要查看是否是这种情况，请在您的函数链中添加.fail()处理程序：

$.when(getSubject())
    .then(getVerb)
    .then(getComplement)
    .done(close)
    .fail() {
         console.log('An error occured.');
    });

Answer 3

你也可以这样调试。它将有助于说明其中一个功能失败的方式：

function getSubject(){
    console.log('getSubject');
    return $.get(
       'sujet.js', //returns "the quick brown fox"
       displayResult
    ).done(function() { console.log("subject failed"); });
}

与其他类似。

试着理解$ .get，$ .when和$ .then

3 个答案: