JSON基础使用详解

JSON：JavaScript对象表示法

1.1 JSON说明

曾经一段时间，XML是互联网传递数据的统一标准，但是业界一直不乏质疑XML的人士，他们都认为XML过于繁琐，冗长；提取数据也过于麻烦

2006年，JSON被提交给了IETF；在这之后，JSON逐渐发展起来，在互联网上得到广泛应用；

我们要记住：JSON只是一种数据格式，主要用来传递数据，并不是一种编程语言，虽然与JavaScript的语法相似，但是并不是JavaScript才使用JSON，毕竟JSON只是一种数据格式，很多编程语言都有针对JSON的解析器和序列化器

1.2 JSON语法

（1）基础语法：

将JavaScript数据转化为JSON数据，也叫——序列化

// 把JavaScript对象序列化成JSON字符串

var jsonText = JSON.stringify(book);

将JSON数据转化为JavaScript数据，也叫——解析

// 将JSON对象解析成原生JavaScript值

var js = JSON.parse(jsonText);

（2）JSON可以表示以下三种类型的数据：

简单值：可以在JSON里面表示 数值、字符串、布尔值、null；不支持 undefined

对象：复杂数据类型，保存一组键值对；在JSON里，对象的键一定要加双引号，值可以是简单值，也可以是复杂数据类型的值

数组：复杂数据类型，保存一组值；值可以是简单值，也可以是复杂数据类型的值

JSON不支持变量，函数，对象实例等，它只是一种表示数据的格式，里面只用来存储数据，不会有逻辑、操作等代码在里面

简单值，简单值中的字符串必须使用双引号，使用单引号报错
```
number、string、bool、null
```
对象，直接使用{ }符号，没有变量，括号后面不用加分号；同一个对象中不应该有相同的属性，以下两个location属性，分别属于不同对象，这样是没有问题的；
```
{

    "name": "过青年",

    "age": 20,

    "arr": [1,2,3,4],

    "location": "江西宜春",

    "school": {

        "location": "江西南昌"

    }

}
```

数组，直接使用[ ]符号，里面简单值和复杂数据类型可以组合使用，构成更复杂的数据集合；

[

    20,

    {

        "name": "过青年",

    	"age": 20

    },

    [1,2,3],

    "过青年"

]

对象和数组一般是JSON数据最外层的结构，利用它们可以创造出各种各样的数据集合

1.3 序列化和解析

1.31 序列化选项

（1）过滤结果

JSON.stringify(js对象,过滤器参数)方法可以传递两个参数

如果过滤器参数是数组，那么JSON.stringify( )的结果将只包含数组中列出的属性

var obj = {

    name: "过青年",

    age: 20,

    arr: [1,2,3,4],

    location: "江西宜春",

    school: {

        location: "江西南昌"

    }

}

console.log(JSON.stringify(obj,["name","age","arr"]));

// {"name":"过青年","age":20,"arr":[1,2,3,4]}

如果过滤器参数是函数(过滤函数)，可以改变序列化对象的结果；函数第一个参数默认是属性名(键)，第二个参数默认是属性值

如果返回的是undefined，则相应的属性名和属性值会被忽略

var jsonText = JSON.stringify(obj,function(key,value){

    switch (key) {

        case "name":

            return 20;

        case "age":

            return "过青年";

        case "arr":

            return [4,3,2,1];

        case "school":

            return undefined;

        default:

            return value;

    }

});

console.log(jsonText);

// {"name":20,"age":"过青年","arr":[4,3,2,1],"location":"江西宜春"}

（2）格式化：字符串缩进、空白符

第三个参数控制缩进和空白符；

如果是一个数值，表示空白字符个数，最大为10，大于10的转换成10；如果第三个参数是有效参数，会自动帮我们插入换行符，提高可读性；

var jsonText = JSON.stringify(obj,null,4);

console.log(jsonText);

/*

{

    "name": "过青年",

    "age": 20,

    "arr": [

        1,

        2,

        3,

        4

    ],

    "location": "江西宜春",

    "school": {

        "location": "江西南昌"

    }

}

*/

如果是一个字符串，这个字符串将被作为缩进字符，而非原来的空白字符作为缩进；字符串参数里的字符个数不能超过10个，超过10个，结果中只出现前十个字符；

var jsonText = JSON.stringify(obj,null,"-");

console.log(jsonText);

/*

{

-"name": "过青年",

-"age": 20,

-"arr": [

--1,

--2,

--3,

--4

-],

-"location": "江西宜春",

-"school": {

--"location": "江西南昌"

-}

}

*/

（3）toJSON方法

我们可以在需要序列化的对象上增加一个toJSON方法，这样当使用JSON.stringify()方法时，实际上就是调用了对象中的toJSON()方法

var obj = {

    name: "过青年",

    age: 20,

    arr: [1,2,3,4],

    location: "江西宜春",

    school: {

        location: "江西南昌"

    },

    toJSON:function(){

        return this.name;

    }

}

var jsonText = JSON.stringify(obj);

console.log(jsonText);

// 过青年

（4）把一个对象传入JSON.stringify()中，序列化该对象的顺序如下：

<1> 如果该对象中有toJSON方法，则直接调用该方法；

<2> 如果JSON.stringify()中有第二个参数，则应用过滤器，过滤器接受的值就是<1>中返回的值

<3> 过滤器处理<1>中返回的值

<4> 如果有第三个参数，执行相应的格式化

var obj = {

    name: "过青年",

    age: 20,

    arr: [1,2,3,4],

    location: "江西宜春",

    school: {

        "location": "江西南昌"

    },

    toJSON:function(){

        name = this.name;

        age = this.age;

        return {name,age};

    }

}

var jsonText = JSON.stringify(obj,function(key,value){

    if(key === "name") {

        return "哈哈哈";

    }else{

        return value;

    }

});

console.log(jsonText); // {"name":"哈哈哈","age":20}

理解序列化对象的过程还是很重要的

1.31 解析选项

JSON.parse()方法也有两个参数，第二个参数是一个函数，叫做还原函数

var obj = {

    name: "过青年",

    age: 20,

    arr: [1,2,3,4],

    location: "江西宜春",

    school: {

        "location": "江西南昌"

    }

};

var jsonText = JSON.stringify(obj);

var jsText = JSON.parse(jsonText,function(key,value){

    if (key === "name") {

        return "哈哈哈哈";

    } else {

        return value;

    }

});

console.log(jsText);

//{name: '哈哈哈哈', age: 20, arr: Array(4), location: '江西宜春', school: {…}}

1.4 总结

JSON.stringify()用于序列化，JSON.parse()用于解析
JSON.stringify()有三个参数，第一个是js对象，第二个是过滤器，第三个是用来格式化JSON输出
JSON.parse()有两个参数，第一个参数是JSON对象，第二个参数是还原函数
js对象中可以声明一个toJSON方法，当JSON.stringify()方法调用时，自动执行toJSON方法
注意，JSON.stringify()方法的返回值都是字符串类型

巴特西