Json對(duì)象

RyanQ 發(fā)布于2019-08-26 10:17 / 2314人閱讀

摘要：張三屬性名必須使用雙引號(hào)不能使用十六進(jìn)制值張三不能使用張三屬性值不能使用函數(shù)和日期對(duì)象注意，空數(shù)組和空對(duì)象都是合法的值。三張三張張三現(xiàn)在，為這個(gè)對(duì)象加上方法。

JSON 格式
JSON 對(duì)象
JSON.stringify()
基本用法
第二個(gè)參數(shù) 用于過(guò)濾數(shù)組或者函數(shù)
第三個(gè)參數(shù) 用于放在屬性開(kāi)頭增加可讀性
參數(shù)對(duì)象的 toJSON 方法
JSON.parse()

1.JSON 格式
復(fù)合類(lèi)型的值只能是數(shù)組或?qū)ο螅荒苁呛瘮?shù)、正則表達(dá)式對(duì)象、日期對(duì)象。
原始類(lèi)型的值只有四種：字符串、數(shù)值（必須以十進(jìn)制表示）、布爾值和null（不能使用NaN, Infinity, -Infinity和undefined）。
字符串必須使用雙引號(hào)表示
對(duì)象的鍵名必須放在雙引號(hào)里面。
數(shù)組或?qū)ο笞詈笠粋€(gè)成員的后面，不能加逗號(hào)。
以下都是合法的 JSON。

["one", "two", "three"]

{ "one": 1, "two": 2, "three": 3 }

{"names": ["張三", "李四"] }

[ { "name": "張三"}, {"name": "李四"} ]
以下都是不合法的 JSON。

{ name: "張三", "age": 32 } // 屬性名必須使用雙引號(hào)

[32, 64, 128, 0xFFF] // 不能使用十六進(jìn)制值

{ "name": "張三", "age": undefined } // 不能使用 undefined

{ "name": "張三",
"birthday": new Date("Fri, 26 Aug 2011 07:13:10 GMT"),
"getName": function () {

  return this.name;

}
} // 屬性值不能使用函數(shù)和日期對(duì)象
注意，null、空數(shù)組和空對(duì)象都是合法的 JSON 值。
2.JSON 對(duì)象
用來(lái)處理 JSON 格式數(shù)據(jù)。它有兩個(gè)靜態(tài)方法：JSON.stringify()和JSON.parse()
3.JSON.stringify()
JSON.stringify方法用于將一個(gè)值轉(zhuǎn)為 JSON 字符串。該字符串符合 JSON 格式，并且可以被JSON.parse方法還原。

JSON.stringify("abc") // ""abc""
JSON.stringify(1) // "1"
JSON.stringify(false) // "false"
JSON.stringify([]) // "[]"
JSON.stringify({}) // "{}"

JSON.stringify([1, "false", false])
// "[1,"false",false]"

JSON.stringify({ name: "張三" })
// "{"name":"張三"}"

對(duì)于原始類(lèi)型的字符串，轉(zhuǎn)換結(jié)果會(huì)帶雙引號(hào)。

JSON.stringify("foo") === "foo" // false
JSON.stringify("foo") === ""foo"" // true

3.基本用法
3.1過(guò)濾
3.1.1如果對(duì)象的屬性是undefined、函數(shù)或 XML 對(duì)象，該屬性會(huì)被JSON.stringify過(guò)濾。

var obj = {
a: undefined,
b: function () {}
};

JSON.stringify(obj) // "{}"

3.1.2如果數(shù)組的成員是undefined、函數(shù)或 XML 對(duì)象，則這些值被轉(zhuǎn)成null。

var arr = [undefined, function () {}];
JSON.stringify(arr) // "[null,null]"

3.1.3正則對(duì)象會(huì)被轉(zhuǎn)成空對(duì)象。

JSON.stringify(/foo/) // "{}"

3.1.4JSON.stringify方法會(huì)忽略對(duì)象的不可遍歷的屬性。

var obj = {};
Object.defineProperties(obj, {
"foo": {

value: 1,
enumerable: true

},
"bar": {

value: 2,
enumerable: false

}
});

JSON.stringify(obj); // "{"foo":1}"
上面代碼中，bar是obj對(duì)象的不可遍歷屬性，JSON.stringify方法會(huì)忽略這個(gè)屬性
3.2第二個(gè)參數(shù)
3.2.1為數(shù)組用于篩選返回的屬性，對(duì)對(duì)象有用，對(duì)數(shù)組沒(méi)用
JSON.stringify(["a", "b"], ["0"])
// "["a","b"]"

JSON.stringify({0: "a", 1: "b"}, ["0"])
// "{"0":"a"}"

3.2.2函數(shù)，用來(lái)更改JSON.stringify的返回值。

function f(key, value) {
if (typeof value === "number") {

value = 2 * value;

}
return value;
}

JSON.stringify({ a: 1, b: 2 }, f)
// "{"a": 2,"b": 4}"

這個(gè)處理函數(shù)是遞歸處理所有的鍵。

var o = {a: {b: 1}};

function f(key, value) {
console.log("["+ key +"]:" + value);
return value;
}

JSON.stringify(o, f)
// []:[object Object]
// [a]:[object Object]
// [b]:1
// "{"a":{"b":1}}"
上面代碼中，對(duì)象o一共會(huì)被f函數(shù)處理三次，最后那行是JSON.stringify的輸出。第一次鍵名為空，鍵值是整個(gè)對(duì)象o；第二次鍵名為a，鍵值是{b: 1}；第三次鍵名為b，鍵值為1。

遞歸處理中，每一次處理的對(duì)象，都是前一次返回的值。

var o = {a: 1};

function f(key, value) {
if (typeof value === "object") {

return {b: 2};

}
return value * 2;
}

JSON.stringify(o, f)
// "{"b": 4}"
上面代碼中，f函數(shù)修改了對(duì)象o，接著JSON.stringify方法就遞歸處理修改后的對(duì)象o

如果處理函數(shù)返回undefined或沒(méi)有返回值，則該屬性會(huì)被忽略。

function f(key, value) {
if (typeof(value) === "string") {

return undefined;

}
return value;
}

JSON.stringify({ a: "abc", b: 123 }, f)
// "{"b": 123}"
上面代碼中，a屬性經(jīng)過(guò)處理后，返回undefined，于是該屬性被忽略了。

3.3第三個(gè)參數(shù)
JSON.stringify還可以接受第三個(gè)參數(shù)，用于增加返回的 JSON 字符串的可讀性。如果是數(shù)字，表示每個(gè)屬性前面添加的空格（最多不超過(guò)10個(gè)）；如果是字符串（不超過(guò)10個(gè)字符），則該字符串會(huì)添加在每行前面。

JSON.stringify({ p1: 1, p2: 2 }, null, 2);
/*
"{
"p1": 1,
"p2": 2
}"
*/

JSON.stringify({ p1:1, p2:2 }, null, "|-");
/*
"{
|-"p1": 1,
|-"p2": 2
}"
*/

4.參數(shù)對(duì)象的 toJSON 方法
如果參數(shù)對(duì)象有自定義的toJSON方法，那么JSON.stringify會(huì)使用這個(gè)方法的返回值作為參數(shù)，而忽略原對(duì)象的其他屬性。

下面是一個(gè)普通的對(duì)象。

var user = {
firstName: "三",
lastName: "張",

get fullName(){

return this.lastName + this.firstName;

}
};

JSON.stringify(user)
// "{"firstName":"三","lastName":"張","fullName":"張三"}"
現(xiàn)在，為這個(gè)對(duì)象加上toJSON方法。

var user = {
firstName: "三",
lastName: "張",

get fullName(){

return this.lastName + this.firstName;

toJSON: function () {

return {
  name: this.lastName + this.firstName
};

}
};

JSON.stringify(user)
// "{"name":"張三"}"
上面代碼中，JSON.stringify發(fā)現(xiàn)參數(shù)對(duì)象有toJSON方法，就直接使用這個(gè)方法的返回值作為參數(shù)，而忽略原對(duì)象的其他參數(shù)。

Date對(duì)象就有一個(gè)自己的toJSON方法。

var date = new Date("2015-01-01");
date.toJSON() // "2015-01-01T00:00:00.000Z"
JSON.stringify(date) // ""2015-01-01T00:00:00.000Z""
上面代碼中，JSON.stringify發(fā)現(xiàn)處理的是Date對(duì)象實(shí)例，就會(huì)調(diào)用這個(gè)實(shí)例對(duì)象的toJSON方法，將該方法的返回值作為參數(shù)。

toJSON方法的一個(gè)應(yīng)用是，將正則對(duì)象自動(dòng)轉(zhuǎn)為字符串。因?yàn)镴SON.stringify默認(rèn)不能轉(zhuǎn)換正則對(duì)象，但是設(shè)置了toJSON方法以后，就可以轉(zhuǎn)換正則對(duì)象了。

var obj = {
reg: /foo/
};

// 不設(shè)置 toJSON 方法時(shí)
JSON.stringify(obj) // "{"reg":{}}"

// 設(shè)置 toJSON 方法時(shí)
RegExp.prototype.toJSON = RegExp.prototype.toString;
JSON.stringify(/foo/) // ""/foo/""
上面代碼在正則對(duì)象的原型上面部署了toJSON()方法，將其指向toString()方法，因此轉(zhuǎn)換成 JSON 格式時(shí)，正則對(duì)象就先調(diào)用toJSON()方法轉(zhuǎn)為字符串，然后再被JSON.stringify()方法處理
5.JSON.parse()
JSON.parse方法用于將 JSON 字符串轉(zhuǎn)換成對(duì)應(yīng)的值。

JSON.parse("{}") // {}
JSON.parse("true") // true
JSON.parse(""foo"") // "foo"
JSON.parse("[1, 5, "false"]") // [1, 5, "false"]
JSON.parse("null") // null

var o = JSON.parse("{"name": "張三"}");
o.name // 張三
如果傳入的字符串不是有效的 JSON 格式，JSON.parse方法將報(bào)錯(cuò)。

JSON.parse(""String"") // illegal single quotes
// SyntaxError: Unexpected token ILLEGAL
上面代碼中，雙引號(hào)字符串中是一個(gè)單引號(hào)字符串，因?yàn)閱我?hào)字符串不符合 JSON 格式，所以報(bào)錯(cuò)。

為了處理解析錯(cuò)誤，可以將JSON.parse方法放在try...catch代碼塊中。

try {
JSON.parse(""String"");
} catch(e) {
console.log("parsing error");
}
JSON.parse方法可以接受一個(gè)處理函數(shù)，作為第二個(gè)參數(shù)，用法與JSON.stringify方法類(lèi)似。

function f(key, value) {
if (key === "a") {