通过JavaScript,认识JSON

  JSON JavaScript
 

是存储和交换文本信息的语法。

是Web的编程语言
对象实例

 JSON对象是一种【JavaScript对象】表示法。

key 必须是字符串。

var person={
         "firstName":"John",
         "lastName":"Doe",
         "age":50,
         "eyeColor":"blue",
}

JavaScript对象是【变量】的容器。

JavaScript对象是【键值对(name:value)】的容器。

把【键值对】称为JavaScript对象的【属性】。

JavaScript对象是【属性】的容器。

var person={
         firstName:"John",
         lastName:"Doe",
         age:50,
         eyeColor:"blue",
}
 访问对象属性  
person.lastName;//方式1
person["lastName"];//方式2
 
person.lastName;//方式1
person["lastName"];//方式2
 数组对象实例  
var persons=[
            {
                   "firstName":"John",
                   "lastName":"Doe",
                   "age":50,
                   "eyeColor":"red",
             },  {
                   "firstName":"Amy",
                   "lastName":"Jok",
                   "age":25,
                   "eyeColor":"yellow",
             },
            {
                  "firstName":"Lili",
                   "lastName":"Yoo",
                   "age":3,
                   "eyeColor":"blue",
             },

];

还可以嵌套数组。

 
var persons=[
            {
                   firstName:"John",
                   lastName:"Doe",
                   age:50,
                   eyeColor:"red",
             },  {
                   firstName:"Amy",
                   lastName:"Jok",
                   age:25,
                   eyeColor:"yellow",
             },
            {
                   firstName:"Lili",
                   lastName:"Yoo",
                   age:3,
                   eyeColor:"blue",
             },

];

访问对象属性

persons[0].firstName;

还可以嵌套数组。

 JSON.parse();

(把JSON字符串转换成JavaScript对象)

JSON最常见的用法之一,是从web服务器上读取JSON数据, 将JSON数据转换为JavaScript对象,然后在网页中使用该数据。
JSON.parse(text,【reviver】);
//text:一个有效的JSON字符串。即text='JSON对象'。
//reviver:一个转换结果的函数。转换后的JavaScript对象,在调用每个成员时,都会进入这个reviver函数。

解析数据

//JSON 不能存储 Date 对象。
//如果需要存储 Date 对象,需要将其转换为字符串。
//之后再将字符串转换为 Date 对象。
var text = '{ "name":"Runoob", "initDate":"2013-12-14", "site":"www.runoob.com"}';
var obj = JSON.parse(text, function (key, value) {
    if (key == "initDate") {
        return new Date(value);
    } else {
        return value;
}});
 
document.getElementById("demo").innerHTML = obj.name + "创建日期:" + obj.initDate;

解析函数

//JSON 不允许包含函数
//但可以将函数作为字符串存储,之后再将字符串转换为函数。
var text = '{ "name":"Runoob", "alexa":"function () {return 10000;}", "site":"www.runoob.com"}';
var obj = JSON.parse(text);
obj.alexa = eval("(" + obj.alexa + ")");
 
document.getElementById("demo").innerHTML = obj.name + " Alexa 排名:" + obj.alexa();

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

eval() 函数使用的是 JavaScript 编译器,可解析 JSON 文本,然后生成 JavaScript 对象。

必须把文本包围在括号中,这样才能避免语法错误:

var txt='JSON对象文本'var obj = eval ("(" + txt + ")");

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

在浏览器中,这提供了原生的 JSON 支持,而且 JSON 解析器的速度更快。

 JSON.stringify()

(将JavaScript对象转换为JSON字符串)

 JSON 通常用于与服务端交换数据。在向服务器发送数据时一般是字符串。

JSON.stringify(value,【replacer】,【space】);
//value:要转换的 JavaScript 值(通常为对象或数组)
//replacer:用于转换结果的函数或数组。
//如果 replacer 为函数,则 JSON.stringify 将调用该函数,并传入每个成员的键和值。
//如果此函数返回 undefined,则排除成员。根对象的键是一个空字符串:""。
//如果 replacer 是一个数组,则仅转换该数组中具有键值的成员。
//成员的转换顺序与键在数组中的顺序一样。当 value 参数也为数组时,将忽略 replacer 数组。
//space:文本添加缩进、空格和换行符。如果 space 是一个数字,则返回值文本在每个级别缩进指定数目的空格,如果 space 大于 10,则文本缩进 10 个空格。space 也可以使用非数字,如:	。

解析数据

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

var obj = {name:"Runoob",initDate:newDate(),site:"www.runoob.com"};
var myJSON = JSON.stringify(obj);
document.getElementById("demo").innerHTML = myJSON;

解析函数

JSON.stringify() 会删除 JavaScript 对象里的函数,包括 key 和 value。

因为JSON 不允许包含函数。

var obj = { name:"Runoob", alexa:function () {return 10000;}, site:"www.runoob.com"};
var myJSON = JSON.stringify(obj);
 
document.getElementById("demo").innerHTML = myJSON;
var obj = { name:"Runoob", alexa:function () {return 10000;}, site:"www.runoob.com"};
var myJSON = JSON.stringify(obj);
 
document.getElementById("demo").innerHTML = myJSON;

可以在执行 JSON.stringify() 函数前将函数转换为字符串来避免以上问题的发生:

var obj = { name:"Runoob", alexa:function () {return 10000;}, site:"www.runoob.com"};
obj.alexa = obj.alexa.toString();
var myJSON = JSON.stringify(obj);
 
document.getElementById("demo").innerHTML = myJSON;
原文地址:https://www.cnblogs.com/Strugglinggirl/p/13761305.html