并行条件异步ajax调用

Question

我有一个与条件 AJAX 调用的优雅解决方案类似的问题，其中参数通过 API 调用加载并在后续 AJAX 调用之前缓存，附加要求是与另一个 AJAX 调用并行运行。

一些伪代码是：

var myParameter;
function myUpdate() {
    $.when(
        // always make one AJAX call
        $.ajax(params1),
        (async () => {
            // retrieve the parameter if not already loaded
            if (myParameter == null) {
                let response = await fetch(someParams);
                myParameter = doStuff(response);  // some irrelevant magic here
            }
            // if the myParameter is 0, do nothing (return a fulfilled promise)
            // otherwise make an AJAX call with params2 + myParameter
            return myParameter == 0 ? $.when() : $.ajax(Object.assign(params2, {data: { value: myParameter }}));
        })()
    ).then(handleData);  // finally do some stuff with the responses in the handleData() function
}

上面的方法似乎不起作用，因为

$.when()

用不同类型的承诺做了奇怪的事情，这导致了这种令人厌恶的事情：

var myParameter;
function myUpdate() {
    $.when(
        $.Deferred((dfrd) => {
            $.ajax(params1).then((response) => {dfrd.resolve(response)});
        }).promise(),
        $.Deferred((dfrd) => {
            if (myParameter == null) {
                fetch(someParams).then((response) => {
                    myParameter = doStuff(response);
                    if(myParameter != 0) {
                        $.ajax(Object.assign(params2, {data: { value = myParameter }})).then((response) => {dfrd.resolve(response)});
                    } else {
                        dfrd.resolve();
                    }
                });
            } else {
                if(myParameter != 0) {
                    $.ajax(Object.assign(params2, {data: { value = myParameter }})).then((response) => {dfrd.resolve(response)});
                } else {
                    dfrd.resolve();
                }
            }
        }).promise()
    ).then(handleData);
}

虽然它有效，并且我可以使用这个答案对其进行一些整理以消除冗余，但我不确定这是正确的方法。

Answer 1

使用普通 JS 来完成所有的 Promise 工作，不再需要 jQuery，

Promise.all

等待几个 Promise：

var myParameter;
function myUpdate() {
    return Promise.all([
        // always make one AJAX call
        $.ajax(params1),
        (async () => {
            if (myParameter == null) {
                let response = await fetch(someParams);
                myParameter = doStuff(response);  // some irrelevant magic here
            }
            if (myParameter) return $.ajax(Object.assign(params2, {data: { value: myParameter }}));
        })()
    ]).then(handleData);  // finally do some stuff with the responses in the handleData() function
}