为什么在调试器中可以看到数据时 window.localStorage 是空的？

Question

我在本地存储中存储了一些数据，但在第一次打开页面时检索它们时遇到问题。

这是我的代码：

lib.getUserGeoLocation();
lib.getUserCityLocation();

var lib = {
    getUserGeoLocation: function(){
        navigator.geolocation.getCurrentPosition(onSuccess, onError);

        function onSuccess(position) {
            window.localStorage.setItem("latitude", position.coords.latitude);
            window.localStorage.setItem("longitude", position.coords.longitude);
        }

        function onError(error) {
            // (...)
        }

    },

    getUserCityLocation: function(){
        var lat = window.localStorage.getItem("latitude");
        var lng = window.localStorage.getItem("longitude");

    console.log(window.localStorage);
    }
}

结果是：Storage {length: 0}
但是当我查看调试器时，数据就在那里：

有谁知道为什么 window.localStorage 为零/window.localStorage.getItem("latitude") returns 为空？

更新

我也试过这个解决方案来确保在我调用 getUserCityLocation():

之前我有这些值

$.when(lib.getUserGeoLocation()).then(function(){
    lib.getUserCityLocation();
});

解决方案

所以我的解决方案是这样的：

getUserGeoLocation: function(callback){
    navigator.geolocation.getCurrentPosition(onSuccess, onError);

    function onSuccess(position) {
        window.localStorage.setItem("latitude", position.coords.latitude);
        window.localStorage.setItem("longitude", position.coords.longitude);
        return callback(true);
    }

    function onError(error) {
        return callback(false, error);
    }
},

Answer 1

这是因为 getUserGeoLocation 需要一些时间来获取数据，然后在 localStorage 中插入值，同时你正在调用函数 getUserCityLocation，所以这会return你无效。

Answer 2

"onSuccess" 和 "onError" 是异步调用，一旦值可用，它们就会被调用，其中 getUserGeoLocation 和 getUserCityLocation 一个接一个地被调用。所以在调用onSuccess回调之前已经调用了getUserCityLocation中的代码

当您使用 when 和 then 时，您应该 return 或者从 when 回调中调用 then 的成功或错误。由于 getUserGeoLocation 没有这样做，你仍然是空的

为什么在调试器中可以看到数据时 window.localStorage 是空的？

Why is window.localStorage empty when I can see the data in the debugger?

html

javascript

local-storage