我似乎無法清除我的localStorage

Question

我似乎無法讓我的localStorage來清除

我有兩個單獨的JS文件，一個被稱爲StorageBin，另一個就被稱爲JAS2。

這是我在StorageBin

function MyStorage() { }; 
MyStorage.Keys = { 
    MyNewObject:"" 
}; 

MyStorage.Keys = function (value) { 
    localStorage.setItem(this.Keys.MyNewObject, JSON.stringify(value)) 
    return value; 
}; 

在JAS2文件

代碼

$(document).ready(function() { 

    var myObject = { 
     Name: "John", 
     LastName: "Doe" 
    } 

    MyStorage.Keys.MyNewObject = myObject; 

    var hereItIs = MyStorage.Keys.MyNewObject; 

    console.log(hereItIs.LastName + ", " + hereItIs.Name); 


    $('#btn').click(function() { 

     //localStorage.removeItem("MyNewObject"); 
     //localStorage.removeItem("MyStorage.Keys.MyNewObject"); 
     //window.localStorage.clear(); 
     //window.localStorage.removeItem("MyNewObject"); 

    }); 

    $('#btn2').click(function() { 
     var hereItIs = MyStorage.Keys.MyNewObject; 

     console.log(hereItIs.LastName + ", " + hereItIs.Name); 
    }); 


}); 

您看到BTN點擊事件註釋掉一切的一切我都試過了。沒有工作，我知道這是因爲我的btn2點擊事件。

我哪裏錯了？

Answer 1

簡短的回答

你設置與對象的條目作爲重點，而不是串。由此產生的密鑰名稱將爲"[object Object]"，因此您無法通過"MyNewObject"或"MyStorage.Keys.MyNewObject"訪問或刪除它。

---

我注意到的第一個問題：MyStorage.Keys不能同時是一個對象和一個函數。所以這段代碼沒什麼意義：

MyStorage.Keys = { // This object will be lost shortly. 
    MyNewObject: "" 
}; 

MyStorage.Keys = function(value){ 
    localStorage.setItem(this.Keys.MyNewObject, JSON.stringify(value)) 
    return value; 
}; 

第一個賦值可以被刪除。

當然，一個新的MyNewObject屬性將這一行後存在：

MyStorage.Keys.MyNewObject = myObject; 

在省電功能（MyStorage.Keys），你設置一個LocalStorage項與鍵this.Keys.MyNewObject。它是指myObject，這是一個對象。這也是沒有意義的，因爲setItem預計字符串作爲第一個參數，而不是一個對象。因此參數將被轉換爲字符串並導致[object Object]。

---

它的出現，但是，你要訪問您的LocalStorage項與任何"MyNewObject"或"MyStorage.Keys.MyNewObject"。所以只是代替這些線路之一進行設置：

localStorage.setItem("MyNewObject", JSON.stringify(value)); 

localStorage.setItem("MyStorage.Keys.MyNewObject", JSON.stringify(value)); 

然後你的兩個第一次嘗試或最後一個生效。

如果你想關鍵是{Name:"John",LastName:"Doe"}，使用

localStorage.setItem(JSON.stringify(this.Keys.MyNewObject), JSON.stringify(value)); 

如果你想關鍵是Doe, John，使用

localStorage.setItem(hereItIs.LastName + ", " + hereItIs.Name, JSON.stringify(value)); 

在任何情況下，如果要刪除這些條目，您需要以同樣的方式生成密鑰。

localStorage.clear();也應該清除本地存儲的所有內容。我無法重現它無法正常工作。

---

調試

您可以通過使用browser console (dev tools)（命中F12）和去Storage標籤調試本地存儲（您可能需要啓用它在開發工具設置）。在那裏你會看到哪些鍵和值被保存。

localStorage.setItem("MyNewObject", JSON.stringify(value)); 

---

進一步的例子

Storage on MDN

設定的入口獲取該條目

localStorage.getItem("MyNewObject"); 

刪除該條目

localStorage.removeItem("MyNewObject");