關於本地快取localstorage與sessionStorage 陣列 （array）字串（string） 物件（object）的儲存技巧和注意事項
阿新 • • 發佈：2019-02-14
localstorage與sessionStorage的使用方法都是一樣的
唯一的區別在與 localstorage是永久儲存在你的計算機上
sessionstorage只要瀏覽器關閉，儲存就消失
<!DOCTYPE html> <html> <head> <title>本地快取</title> </head> <body> </body> <script type="text/javascript"> //儲存一個數組到本地快取陣列 var a = [1,2,3] console.log(typeof a) //object //儲存 sessionStorage.setItem("sa",a); //取出 並用a1接收這個值 var a1 = sessionStorage.getItem("sa") //列印a1的資料型別 console.log( typeof a1);//結果為string //取出來不能當做陣列用，必須得把字串轉換成陣列 console.log(a1.split(",")) // ["1", "2", "3"] 轉換為“,”隔開的陣列,其陣列元素還是字串， //用之前先轉換為Number型別,-0或者*1即可轉換為Number型別 // console.log(JSON.parse(a1)) //這一行就會報錯 因為a1本來就不是json串型別的資料， //他只能轉換JSon串型別的資料 //若儲存前先轉換為json串型別 var b = [1,2,3] //轉換為Json串 var b1 = JSON.stringify(b); sessionStorage.setItem("sb",b1); var b2 = sessionStorage.getItem("sb"); console.log( typeof b2) //string console.log( typeof JSON.parse(b2)) // object console.log( typeof JSON.parse(b2)[2]) //number console.log( JSON.parse(b2)) //[1,2,3] console.log(JSON.parse(b2)[1]) //陣列的第二個元素2 //總結 1、 儲存前轉換為json串的形式，取出後轉換為json物件形式可以當做陣列直接用； // 2、無論儲存前是什麼資料型別 取出來之後他都會是一個字串（string）型別 // 3、儲存字串時，取出來就直接可以用。 // 4、特別注意，當你儲存一個物件的時候，必須先轉換為json串儲存，不然物件就沒法用了 //看下面的demo var c = { name:"name", age:18, love:"美女" } sessionStorage.setItem("sc",c); var c1 = sessionStorage.getItem("sc"); console.log(typeof c1) //string console.log(c1) // [object object] console.log(c1.anme) //undefined //是不是要轉換為json物件 我們試試 // var c2 = JSON.parse(c1); //直接報錯 繼續向下看 //儲存前轉換為json串 var d = { name:"name", age:18, love:"美女" } var e = JSON.stringify(d) sessionStorage.setItem("sd",e); var d1 = sessionStorage.getItem("sd"); console.log(typeof d1) //string console.log(d1) // {"name":"name","age":18,"love":"美女"} console.log(d1.anme) //undefined var f = JSON.parse(d1) console.log(f) //Object {name: "name", age: 18, love: "美女"} console.log(f.age) //18 </script> </html>
下面在看看儲存進去的數值到底是什麼，在控制檯的
