javascript - Web 存储可用性的奇怪行为检查

Question

这是我的代码：

if(typeof(Storage)!==undefined) {
    // Web storage support
    if(localStorage.hashes != "") {
        var hashes = jQuery.parseJSON(localStorage.hashes);
        for (var i = 0; i < hashes.length; i++) {
            // Do stuff here
        }
    }
    else {
        var hashes = [];
    }
}
else {
    // No web storage support
}

我真的不知道发生了什么，但是当我第一次尝试从设备加载带有此代码的页面时，我的其余代码无法正常工作。但是，如果我将其注释掉，那么第一次访问该页面一切正常。然后我可以取消注释，重新加载页面，一切都会继续工作。这真的是我能描述的最好的情况。

Answer 1

我相信您可以在发布之前进行更多调试。

您是否尝试过记录/添加检查（以查看此问题的确切来源以及错误是什么）？

但是既然我们在这里，这里是我对 localStorage 的提示：

• 使用modernizr (http://modernizr.com/)

if(Modernizr.localstorage){ /* Your code */}

• 制作一些通用的 get 和 set 函数

function get(key) {

   if(Modernizr.localstorage) { 
      if(localStorage[key] != null) {
        return localStorage[key];
      }
   }
   return null;
}

function set(key, value) {

   if(Modernizr.localstorage) { 
      localStorage[key] = value;
   }
   return null;
}

这很粗糙，您可以调整它以使其更安全并满足您的需求

• 将 try/catch 放在 get 和 set 函数中，您不希望写操作影响您的程序

Answer 2

我想到了！所以在上面的代码中，我检查他们是否有可用的 localStorage，如果有，我只是假设他们在那里存储了一些哈希值。这显然会在他们第一次访问时产生问题，因为他们还没有保存任何哈希值。所以我必须检查它们是否有，如果有，则执行 for 循环，否则只需将其设置为空数组。像这样！

if(typeof(Storage) !== "undefined") {
    // Web storage support
    if(localStorage.hashes != "") {
        hashes = JSON.parse(localStorage.getItem("hashes"));
        if(hashes) {
            for (var i = 0; i < hashes.length; i++) {
                // Do Stuff
            }
        } else {
            hashes = [];
        }
    }
    else {
        hashes = [];
    }
}
else {
    // No web storage support
    hashes = [];
}

感谢 jbabey 提供一些关于清理我的代码的提示！