如何在循环中正确使用jQuery Deferred

sg2wtvxw 于 2022-12-18 发布在 jQuery

关注(0)|答案(1)|浏览(129)

我试图调用一个函数，该函数循环遍历数据集，并根据来自异步函数的数据更新数据集中的值，显然我需要知道该函数何时完成循环和更新。
这是我目前拥有的：

function loadStationData() {
    var $dfd = $.Deferred();
    $.getJSON('../backend/navigation/get-stations.php', function(data) {
        stationData = data;
        $dfd.resolve();
    });
    return $dfd.promise();
}

function updateStationData() {
    var $dfd = $.Deferred();
    $.each(stationData, (i,v) => {
        var $dfd2 = $.Deferred();
        $.when(getFullCoordPack(v.lat, v.lng)).then(function(coords) {
            delete v.lat;
            delete v.lng;
            v.coords = coords;
            $dfd2.resolve();
        });
        return $dfd2.promise();
    });
    return $dfd.promise();
}

$.when(loadStationData(), updateStationData()).then(() => {
    // do stuff
});

函数getFullCoordPack(v.lat, v.lng)使用What3Words的API，因此包含 AJAX 调用，因此需要在完成时进行承诺。
然而，我很难理解如何在第二个函数中使用Deferred对象，需要一些关于如何最好地实现我的目标的建议。

jquery

来源：https://stackoverflow.com/questions/74805022/how-to-properly-use-jquery-deferred-inside-of-a-loop

1条答案

按热度按时间

0yg35tkg1#

$.getJSON已经返回了一个promise，因此不需要为它使用新的Deferred。
在第二个函数中，没有解析$dfd的代码。
然而，自ECMAScript 2015年以来，已经没有理由再使用jQuery Deferred了，现在promise在JavaScript中是原生的，还有async/await语法和返回promise的API，比如fetch。
因此，类似下面的代码应该可以工作（假设getFullCoordPack返回一个promise对象）：

async function getStations() {
    const response = await fetch('../backend/navigation/get-stations.php'); 
    const stationData = await response.json();
    return Promise.all(stationData.map(async ({lat, lng, ...rest}) => ({
        ...rest,
        coords: await getFullCoordPack(lat, lng)
    })));
}

getStations().then((stationData) => {
    // do stuff with stationData
});

赞(0）回复(0）举报 2022-12-18

我来回答

如何在循环中正确使用jQuery Deferred

1条答案

相关问题

热门标签

最新问答