sessionStorage存儲json對象


應用場景:

賬單列表中A頁面:點擊其中的一列,ajax返回的數據在這一頁

 

點擊進入賬單詳情B頁面:

因為在A頁面已經做過ajax的請求了,所以希望把當前其中的一個數組對象傳到B頁面中,所以,就考慮到暫時存到sessionStorage中。

 

目的:A頁面傳json對象到B頁面中;

方法:sessionStorage;

注意的問題,sessionStorage.setItem("key","value")內存儲的都是字符串,所以,可想而知,如果以對象的形式存到sessionStorage,那么,在從sessionStorage.getItem("key")取到的也只能是object字符了;

所以解決的思路就如此了

就是,A頁面對象數組轉字符串數組,再存到sessionStorage,到B頁面里面,取出,字符串數組再轉對象數組。

這里主要用到了:

JSON.stringify();

JSON.parse();

 

總結:

 

  1.     //總結 1、 存儲前轉換為json串的形式,取出后轉換為json對象形式可以當做數組直接用;  
  2.     //     2、無論存儲前是什么數據類型  取出來之后他都會是一個字符串(string)類型  
  3.     //     3、存儲字符串時,取出來就直接可以用。  
  4.     //     4、特別注意,當你存儲一個對象的時候,必須先轉換為json串存儲,不然對象就沒法用了  

這個博客寫的很好理解:

http://blog.csdn.net/wxl1555/article/details/52666217

<!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>  

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM