JSON 使用

JSON: JavaScript Object Notation(JavaScript 对象表示法) 

JSON 是存储和交换文本信息的语法。类似 XML。

JSON 比 XML 更小、更快，更易解析。

语法

JSON 语法是 JavaScript 对象表示语法的子集。

• 数据在名称/值对中
• 数据由逗号分隔
• 大括号保存对象
• 中括号保存数组

JSON 名称/值对

JSON 数据的书写格式是：名称/值对。

名称/值对包括字段名称（在双引号中），后面写一个冒号，然后是值：

"name" : "名字"

JSON 值

JSON 值可以是：

 

• 数字（整数或浮点数）
• 字符串（在双引号中）
• 逻辑值（true 或 false）
• 数组（在中括号中）
• 对象（在大括号中）
• null

JSON 数字

JSON 数字可以是整型或者浮点型：

{ "age":30 }

 JSON 对象 

JSON 对象在大括号（{}）中书写：

对象可以包含多个名称/值对：

{ "name":"名字" , "url":"https://mp.csdn.net/postedit" }

 JSON 数组

JSON 数组在中括号中书写：

数组可包含多个对象：

{ 
    "sites": [ 
        { "name":"名字" , "url":"https://mp.csdn.net/postedit" }, 
        { "name":"名字" , "url":"https://mp.csdn.net/postedit" } 
    ] 
}

在上面的例子中，对象 "sites" 是包含三个对象的数组。每个对象代表一条关于某个网站（name、url）的记录。

JSON 布尔值

JSON 布尔值可以是 true 或者 false：

{ "flag":true }

JSON null

JSON 可以设置 null 值：

{ "name":null }

应用 

JSON.stringify()

 JSON.stringify() 方法将 JavaScript 对象转换为字符串

语法

JSON.stringify(value[, replacer[, space]])

参数说明：

• value:

  必需， 要转换的 JavaScript 值（通常为对象或数组）。

• replacer:

  可选。用于转换结果的函数或数组。

  如果 replacer 为函数，则 JSON.stringify 将调用该函数，并传入每个成员的键和值。使用返回值而不是原始值。如果此函数返回 undefined，则排除成员。根对象的键是一个空字符串：""。

  如果 replacer 是一个数组，则仅转换该数组中具有键值的成员。成员的转换顺序与键在数组中的顺序一样。当 value 参数也为数组时，将忽略 replacer 数组。

• space:

  可选，文本添加缩进、空格和换行符，如果 space 是一个数字，则返回值文本在每个级别缩进指定数目的空格，如果 space 大于 10，则文本缩进 10 个空格。space 也可以使用非数字，如：\t。

JavaScript 对象转换 

我们使用 JSON.stringify() 方法处理以上数据，将其转换为字符串：

var obj = { name:"名字", alexa:10000 };
var myJSON = JSON.stringify(obj);//字符串 {"name":"名字","alexa":10000}

 JavaScript 数组转换

将 JavaScript 数组转换为 JSON 字符串：

var arr = [ "Google", "Runoob", "Taobao", "Facebook" ];
var myJSON = JSON.stringify(arr);//字符串 ["Google","Runoob","Taobao","Facebook"]

异常

解析数据

JSON 不能存储 Date 对象。

JSON.stringify() 会将所有日期转换为字符串。

var obj = {"initDate":new Date()};
var myJSON = JSON.stringify(obj);//{"initDate":"2019-04-24T08:03:50.546Z"}

解析函数

JSON 不允许包含函数，JSON.stringify() 会删除 JavaScript 对象的函数，包括 key 和 value。

var obj = { "name":"名字", "alexa":function () {return 10000;}};
var myJSON = JSON.stringify(obj); //{"name":"名字"}

 JSON.parse()

JSON.parse() 方法将数据转换为 JavaScript 对象

语法

JSON.parse(text[, reviver])

参数说明：

• text:必需， 一个有效的 JSON 字符串。
• reviver: 可选，一个转换结果的函数， 将为对象的每个成员调用此函数。

var obj = JSON.parse('{ "name":"名字", "alexa":10000 }'); //对象 { name: '名字', alexa: 10000 }

注意：解析前要确保你的数据是标准的 JSON 格式，否则会解析出错。

 

异常

解析数据

JSON 不能存储 Date 对象。

如果你需要存储 Date 对象，需要将其转换为字符串。

之后再将字符串转换为 Date 对象。

var text = '{ "initDate":"2018-12-14"}';
var obj = JSON.parse(text);
var date = new Date(obj.initDate);

解析函数

JSON 不允许包含函数，但你可以将函数作为字符串存储，之后再将字符串转换为函数。

var text = '{ "alexa":"function () {return 10000;}"}';
var obj = JSON.parse(text);
var alexa = eval("(" + obj.alexa + ")");

  eval() 可用于将 JSON 文本转换为 JavaScript 对象

var txt = '{ "employees" : [' +
    '{ "firstName":"Bill" , "lastName":"Gates" },' +
    '{ "firstName":"George" , "lastName":"Bush" },' +
    '{ "firstName":"Thomas" , "lastName":"Carter" } ]}';

var obj = eval ("(" + txt + ")");

 提示：eval() 函数可编译并执行任何 JavaScript 代码。这隐藏了一个潜在的安全问题。

使用 JSON 解析器将 JSON 转换为 JavaScript 对象是更安全的做法。JSON 解析器只能识别 JSON 文本，而不会编译脚本。