JSON.stringify() / JSON.parse()

JSON.stringify() 這個方法可以把javascript對象轉換成json字符串。

JSON.parse() 這個方法可以把 json 字符串轉換成 javascript對象。

【下面來看一下這兩個方法的詳細解答】

json數據中沒有變量和結尾的分號，並且數據必須是用雙引號引起來的，單引號會報語法錯誤。

json的數據格式：

{
        "name":"chef",
        "child":{
            "name1":"children",
            "age1":[
                "one",
                "two",
                "three"
            ],
            "hello":"world"
        },
        "age":33
    }

 

JSON.stringify()

　　把一段 javascript 對象序列化為 json 字符串忽略縮進與空格，並可以把單引號給你改成雙引號，此方法還可以傳入第二個參數，這第二個參數可以是一個數組，也可以是一個函數。如果是數組，那么數組元素一定要與javascript對象中的鍵相匹配（鍵值對的鍵）

如果是一個數組，那么表示序列化這個數組元素相對應的javascript對象的鍵值對

// 此對象貫穿全文
var js = {
        "name":"chef",
        "child":{
            "name1":"children",
            "age1":[
                "one",
                "two",
                "three"
            ],
            "hello":"world"
        },
        "age":33
    }

    // 把 javascript對象序列化為 json 字符串忽略縮進與空格
    var js_json = JSON.stringify(js);

    console.log(js_json); //{"name":"chef","child":{"name":"children","age":["one","two","three"],"hello":"world"},"age":33}


    //序列化選項傳入數組
    var js_option = JSON.stringify(js,["child","age"]);

    //只序列化了指定的 鍵 ：child age
    console.log(js_option); //{"child":{"age":["one","two","three"]},"age":33}

 

 

還可以傳入一個函數，這個函數有兩個參數，即（key,value）被序列化的json字符串的鍵值對，可以在函數的內部改變這些value

//序列化選項 傳入一個函數
    var js_fn = JSON.stringify(js,function(key,value){
        switch(key){
            case "age1":
                //把age1的值用逗號分隔成字符串
                return value.join(",");

            case "name1":
                //把原來的值替換掉
                return "直接把原來的值修改了";

            case "hello":
                //刪除該鍵值對
                return undefined;

            //沒有default這句獲取不到數據
            default:
                return value;
        }
    });

    console.log("傳入函數的結果："+js_fn);
    //傳入函數的結果：{"name":"chef","child":{"name1":"直接把原來的值修改了","age1":"one,two,three"},"age":33}

　　

　　還可以傳入第三個參數，(第二個參數不傳可以寫null) 第三個參數是控制json字符串縮進的，它是個數字或字符串，數字最多縮進10，如果傳入的大於10則自動轉化為10，如果傳入的是字符串，則用這個字符串當做縮進符來代替空格

//傳入第三個參數控制字符串縮進
    var js_indent = JSON.stringify(js,null,4);

    console.log("縮進后的json字符串："+js_indent);
    /*
    瀏覽器執行效果：
         縮進后的json字符串：{
            "name": "chef",
            "child": {
                "name1": "children",
                "age1": [
                    "one",
                    "two",
                    "three"
                ],
                "hello": "world"
            },
            "age": 33
         }
    */

toJSON()

　　定義在javascript對象中，當序列化javascript對象的時候，會先調用toJSON方法然后序列化toJSON返回的值，如果toJSON方法return undefined,那么這個javascript對象的值就是undefined,如果包含toJSON方法的對象被嵌入在其他的對象里，那么包含toJSON方法的對象的值會變為null

var js_tojson = {
        name:'chef',
        age:'22',

        //在javascript對象中這樣定義 toJSON 方法
        toJSON:function(){

            return {name:this.name,age:this.age};
        }
    };

    //調用stringify()方法序列化對象
    var tojsonText = JSON.stringify(js_tojson);

    console.log("調用 toJSON 的結果："+tojsonText) //調用 toJSON 的結果：{"name":"chef","age":"22"}

【序列化的順序是先檢查 javascript對象中是否有 toJSON方法，如果有那么先執行toJSON方法，返回什么就序列化什么】

stringify()參數的執行順序：
　　1,第一個參數
　　2,檢查toJSON並執行
　　3,第二個參數
　　4,第三個參數

 

 

JSON.parse()

 

把一段json字符串解析為原生javascript值 如果傳給parse()的不是有效的json字符串，這個方法會拋出錯誤

// 把 json 字符串解析為原生javascript值
    var json_js = JSON.parse(js_json);

    console.log(json_js); // Object {name: "chef", child: Object, age: 33}

parse()方法也有第二個參數，可以給它傳一個函數，這個函數同樣有兩個值，（key,value）這個函數的功能跟 stringify()的第二個函數的功能一樣

    //==== perse() 的第二個參數
    var perse_fn = {
        name:"chef",
        age:66,
        newDate: new Date()
    }

    //先把perse_fn對象轉換成json字符串
    var perse_json = JSON.stringify(perse_fn);

    //再把json字符串轉為javascript對象
    var perse_js = JSON.parse(perse_json,function(key,value){
        switch(key){
            case "name":

                //可以改變 value
                return value+"大廚的筆記";

            case "newDate":

                //返回時間對象
                return new Date();

            // 這個 default 必須有，不然就 undefined 了，
            default:
                return value;
        }
    });

    console.log(perse_js);//Object {name: "chef大廚的筆記", age: 66, newDate: Thu Nov 10 2016 22:52:20 GMT+0800 (中國標准時間)}

以上就是本人對 json 的總結。