如何获取更新的对象答案

【问题标题】：How do I get the updated objects如何获取更新的对象
【发布时间】：2016-04-11 00:56:46
【问题描述】：

这就是问题所在，我对代表对象数组的文件执行 Ajax 请求，然后逐个更新数组中的每个对象，然后使用 JSON.stringify 将数组存储在 localStorage 中。完成所有这些之后，在控制台中我得到了包含更新对象的数组，但是当我存储数组时，它是存储的旧数组。

这是我的代码。

var relaisList;
function updateRelaisList(){
    $.ajax({
        "dataType":"json",
        "url": "assets/json/relaisList.json"
    })
    .done(function(response){
        console.log("ajax updatedRelaisList SUCCESS");
        //add lat and lng for all relaisList objects
        for(var i = 0, c = response.length; i < c; i++){
            addLatLng(response[i]);
        }
        //store the updated array in the localStorage
        console.log("below is the updatedRelaisList>>>")
        console.log(response)
        relaisList = response
        window.localStorage.setItem("foo", JSON.stringify(relaisList))  


    })
    .fail(function(){
        console.log("ajax updateRelaisList FAIL");
    })
}

function addLatLng(obj){
    var fullAddress = obj.name + "," + obj.address + "," + obj.zip;
    $.ajax({
        "dataType":"json",
        "url": "https://maps.googleapis.com/maps/api/geocode/json?address=" + fullAddress + "&key=AIzaSyB67tGq_pe2p6ma3QVlkciQaL4-rKIC_UE"
    })
    .done(function(response){
        console.log("ajax addLatLng SUCCESS");
        //update the object adding 2 properties lat and lng
        obj.lat = response.results[0].geometry.location.lat;
        obj.lng = response.results[0].geometry.location.lng;
        // console.log(obj)
    })
    .fail(function(){
        console.log("ajax addLatLng FAIL");
    })  
}

欢迎询问更多详情

【问题讨论】：

只是一个简单的猜测，但我的想法是，因为您使用的是预先编写的方法，该方法还调用 ajax 向您的对象添加信息，但随后在本地存储之后，您的本地存储是更新速度比返回 ajax 调用快。
Ajax 请求需要一些时间才能完成，并且也是异步的。因此，请检查您尝试访问该变量的其他代码是否在存储之前未执行。

标签： jquery json ajax local-storage

【解决方案1】：

您能否尝试使用以下修改后的代码。此代码将等待所有 Ajax 响应，并且仅当从谷歌地图获取所有纬度/经度时才会将数据上传到本地存储：

var relaisList;
function updateRelaisList(){
    $.ajax({
        "dataType":"json",
        "url": "assets/json/relaisList.json"
    })
    .done(function(response){
        console.log("ajax updatedRelaisList SUCCESS");
        addLatLng(response);
     })
    .fail(function(){
        console.log("ajax updateRelaisList FAIL");
    })
}

function addLatLng(response){
    var updatedResponse =[];
    //add lat and lng for all relaisList objects
    for(var i = 0, c = response.length; i < c; i++){
        obj = response[i];
        var fullAddress = obj.name + "," + obj.address + "," + obj.zip;
        $.ajax({
            "dataType":"json",
            "url": "https://maps.googleapis.com/maps/api/geocode/json?address=" + fullAddress + "&key=AIzaSyB67tGq_pe2p6ma3QVlkciQaL4-rKIC_UE"
        })
        .done(function(response_inner){
            console.log("ajax addLatLng SUCCESS");
            //update the object adding 2 properties lat and lng
            obj.lat = response_inner.results[0].geometry.location.lat;
            obj.lng = response_inner.results[0].geometry.location.lng;
            updatedResponse.push(obj);
            if(updatedResponse.length == response.length){
                //store the updated array in the localStorage
                console.log("below is the updatedRelaisList>>>")
                console.log(response)
                relaisList = response
                window.localStorage.setItem("foo", JSON.stringify(relaisList));  
            }
        })
        .fail(function(){
            console.log("ajax addLatLng FAIL");
        })  

    }


}

【讨论】：