localStorage存儲JSON對象的小方法

有時候，我們需要將數據存儲到sessionStorage和localStorage中，這樣做的好處有：

1 緩存數據

2 減少對內存的占用

但是，storage只能存儲字符串的數據，對於JS中常用的數組或對象卻不能直接存儲。

 

var obj = { name:'Jim' }; sessionStorage.obj = obj; localStorage.obj = obj; var arr = [1,2,3]; sessionStorage.obj = arr; localStorage.obj = arr;

 

 

上面的寫法都是不能成功的！但我們可以通過JSON對象提供的parse和stringify將其他數據類型轉化成字符串，再存儲到storage中就可以了。請看下面的代碼。

 

var obj = { name:'Jim' }; var str = JSON.stringify(obj); //存入 sessionStorage.obj = str; //讀取 str = sessionStorage.obj; //重新轉換為對象 obj = JSON.parse(str);

 

 

localStorage也一樣，只是和sessionStorage的存儲時間不一樣。

需要注意的是，JS中的數組本質上也是對象類型，所以上面的代碼對數組也是適用的。

 

 

利用localStorage可以簡單的存儲一些JSON對象，可以方便簡易應用的數據存儲。

　　簡單介紹下localStorage，localStorage是html5提供的一種本地存儲的方法，可以把數據存儲在本地瀏覽器，下次打開后仍然可以獲取到存儲的數據，如果在存儲的數據 量小的時候可以起到代替數據庫的功能，比cookies更有優越性。

 

localStorage.setItem("key","value");//存儲變量名為key，值為value的變量
 
 localStorage.key = "value"//存儲變量名為key，值為value的變量
 
 localStorage.getItem("key");//獲取存儲的變量key的值www.it165.net
 
 localStorage.key;//獲取存儲的變量key的值
 
 localStorage.removeItem("key")//刪除變量名為key的存儲變量

 

 

以上即為localStorage調用的方法。下面介紹存儲JSON對象的方法。

 

var students = 
 {
 liyang:{name:"liyang",age:17},
 
 lilei:{name:"lilei",age:18}
 
 }//要存儲的JSON對象
 
 
 students = JSON.stringify(students);//將JSON對象轉化成字符串
 
 localStorage.setItem("students",students);//用localStorage保存轉化好的的字符串

 

 

 

上面即可保存JSON對象，接下來我們在要使用的時候再將存儲好的students變量取回

var students = localStorage.getItem("students");//取回students變量

students = JSON.parse(students);//把字符串轉換成JSON對象

以上即可得到存儲的students的JSON對象了