Jquery 如何确保.then（）中的函数在继续之前完成？

下面是$.when（）.then（）的用法

setLineDet（）的代码：

setHeaderSet（）的代码：

控制台输出：

line 1
line 4
line 2
line 3
done setting line details
header 1
header 4
done setting header details
done setting other details
header 2
header 3
hasValue: 3, doneSetOpr: 0
set desc1
set desc2
set desc3

line 1
line 2
line 3
done setting line details
header 1
header 2
header 3
set desc1
set desc2
set desc3
done setting header details
done setting other details

//the "set desc1/2/3" is displayed from the setDesc() function

如您所见，setLineDet函数已完成，然后才移动到setHeaderDet。但是，它没有完成setHeaderDet功能，而是立即移动到setOtherDet。我真的不知道为什么，因为我对所有函数都使用相同的方法（创建$.Deferred、.resolve（）、.promise（））

此外，我无法理解为什么doneSetOpr值没有增加。由于该值不等于hasValue，因此未执行.resolve（）。因此，我尝试删除if语句，只放置.resolve（）。结果仍然是相同的输出

p、 我的程序运行得很好。这意味着没有错误，最终所有值都被准确设置，不会造成致命问题。我只是想了解使用Promissions和deferred的正确方法，因为我可能用错了，因为在继续下一步之前，后续的.then（）没有在中完成函数。谢谢。

关键点：

您只需返回开始时已创建的承诺，然后在.then（）中返回承诺即可。而不是创建延迟对象，这最终会导致延迟反模式

阅读并查看@Bergi链接中的延迟反模式示例

setLineDet（）的代码：

setHeaderSet（）的代码：

控制台输出：

line 1
line 4
line 2
line 3
done setting line details
header 1
header 4
done setting header details
done setting other details
header 2
header 3
hasValue: 3, doneSetOpr: 0
set desc1
set desc2
set desc3

line 1
line 2
line 3
done setting line details
header 1
header 2
header 3
set desc1
set desc2
set desc3
done setting header details
done setting other details

//the "set desc1/2/3" is displayed from the setDesc() function

---

你需要阅读和学习承诺链。

.then（）

处理程序中的异步操作需要自身返回一个承诺，然后在

.then（）

处理程序中返回该承诺。这将导致承诺链在前进到链中的下一个

之前等待该承诺。然后（）

。避免！感谢您对jfriend00和Bergi的回复。我一定会看看延迟的反模式。

line 1
line 4
line 2
line 3
done setting line details
header 1
header 4
done setting header details
done setting other details
header 2
header 3
hasValue: 3, doneSetOpr: 0
set desc1
set desc2
set desc3

$.when(setLineDet(rptId, rptLn)).then(function(data) {
    console.log("done setting line details");
    return setHeaderDet(rptId);
    }).then(function(data) {
        console.log("done setting header details");
        return setOtherDet();
        }).then(function(data) {
            console.log("done setting other details");
        });

function setLineDet(id, ln) {
    console.log("line 1");

    funcSel = "get_ln_det";
    var passVar = funcSel+"~@"+id+"~@"+ln;
    
    return ajaxCall(passVar).done(function(data) {
        console.log("line 2");
        var lnData = data.trim().split("~@");
        
        // set line values
        
        return lnData[0];
    }).then(function(data) {
        console.log("line 3");
        return setRptLnList(data);
    });
}

function setHeaderDet(id) {
    console.log("header 1");
    
    funcSel = "get_hdr_det";
    var passVar = funcSel+"~@"+id;
    
    var hdrDataCpy = ""
    
    return ajaxCall(passVar).then(function(data) {
        console.log("header 2");
        var hdrData = data.trim().split("~@");
        hdrDataCpy = hdrData;
        
        //set header values
        
        return hdrData;
    }).then(function(data) {
        console.log("header 3");
        return $.when(setDesc("desc1", hdrDataCpy[6])).then(function(data) {
            return setDesc("desc2", hdrDataCpy[7]);
        }).then(function(data) {
            return setDesc("desc3", hdrDataCpy[8]);
        }).then(function(data) {
            return setDesc("desc4", hdrDataCpy[9]);
        }).then(function(data) {
            return setDesc("desc5", hdrDataCpy[10]);
        }).then(function(data) {
            return setDesc("desc6", hdrDataCpy[11]);
        });
    });
}

line 1
line 2
line 3
done setting line details
header 1
header 2
header 3
set desc1
set desc2
set desc3
done setting header details
done setting other details

//the "set desc1/2/3" is displayed from the setDesc() function