我们先来看一个JS中常见的JS对象序列化成JSON字符串的问题，请问，以下JS对象通过JSON.stringify后的字符串是怎样的？先不要急着复制粘贴到控制台，先自己打开一个代码编辑器或者纸，写写看，写完再去仔细对比你的控制台输出，如果有误记得看完全文并评论，哈哈。
var friend={ firstName: 'Good', 'lastName': 'Man', 'address': undefined, 'phone': ["{{1234567:0}}",undefined], 'fullName': function(){ return this.firstName + ' ' + this.lastName; }};JSON.stringify(friend);//这一行返回什么呢？
第二个问题，如果我想在最终JSON字符串将这个’friend’的姓名全部变成大写字母，也就是把”Good”变成”GOOD”，把”Man”变成”MAN”，那么可以怎么做？
基于以上两个问题，我们再追本溯源问一下，JSON究竟是什么东西？为什么JSON就是易于数据交换？JSON和JS对象的区别？JS中JSON.parse、JSON.stringify和不常见的toJSON，这几个函数的参数和处理细节到底是怎样的？
欢迎进入本次“深挖JSON之旅”，下文将从以下几个方面去理解JSON：
首先是对“JSON是一种轻量的数据交换格式”的理解；
然后来看经常被混为一谈的JSON和JS对象的区别；
最后我们再来看JS中这几个JSON相关函数具体的执行细节。
希望全文能让如之前的我一样对JSON一知半解的亲能说清楚JSON是什么，也能熟练运用JSON，不看控制台就知道JS对象序列化成JSON字符串后输出是啥。
一、JSON是一种格式，基于文本，优于轻量，用于交换数据
如果没有去过JSON的官方介绍可以去一下这里，官方介绍第一、二段已经很清楚地表述了JSON是什么，我将JSON是什么提炼成以下几个方面：
1. 一种数据格式
什么是格式？就是规范你的数据要怎么表示，举个栗子，有个人叫“二百六”，身高“160cm”，体重“60kg”，现在你要将这个人的这些信息传给别人或者别的什么东西，你有很多种选择：
姓名“二百六”，身高“160cm”，体重“60kg”
name="二百六"&height="160cm"&weight="60kg"
<person><name>二百六</name><height>160</height><weight>60</weight></person>
{"name":"二百六","height":160,"weight":60}
… …
以上所有选择，传递的数据是一样的，但是你可以看到形式是可以各式各样的，这就是各种不同格式化后的数据，JSON是其中一种表示方式。
2. 基于文本的数据格式
JSON是基于文本的数据格式，相对于基于二进制的数据，所以JSON在传递的时候是传递符合JSON这种格式(至于JSON的格式是什么我们第二部分再说)的字符串，我们常会称为“JSON字符串”。
3. 轻量级的数据格式
在JSON之前，有一个数据格式叫xml，现在还是广泛在用，但是JSON更加轻量，如xml需要用到很多标签，像上面的例子中，你可以明显看到xml格式的数据中标签本身占据了很多空间，而JSON比较轻量，即相同数据，以JSON的格式占据的带宽更小，这在有大量数据请求和传递的情况下是有明显优势的。
4. 被广泛地用于数据交换
轻量已经是一个用于数据交换的优势了，但更重要的JSON是易于阅读、编写和机器解析的，即这个JSON对人和机器都是友好的，而且又轻，独立于语言（因为是基于文本的），所以JSON被广泛用于数据交换。
以前端JS进行ajax的POST请求为例，后端PHP处理请求为例：
前端构造一个JS对象，用于包装要传递的数据，然后将JS对象转化为JSON字符串，再发送请求到后端；
后端PHP接收到这个JSON字符串，将JSON字符串转化为PHP对象，然后处理请求。
可以看到，相同的数据在这里有3种不同的表现形式，分别是前端的JS对象、传输的JSON字符串、后端的PHP对象，JS对象和PHP对象明显不是一个东西，但是由于大家用的都是JSON来传递数据，大家都能理解这种数据格式，都能把JSON这种数据格式很容易地转化为自己能理解的数据结构，这就方便啦，在其他各种语言环境中交换数据都是如此。
二、JSON和JS对象之间的“八卦”
很多时候都听到“JSON是JS的一个子集”这句话，而且这句话我曾经也一直这么认为，每个符合JSON格式的字符串你解析成js都是可以的，直到后来发现了一个奇奇怪怪的东西…
1. 两个本质不同的东西为什么那么密切
JSON和JS对象本质上完全不是同一个东西，就像“斑马线”和“斑马”，“斑马线”基于“斑马”身上的条纹来呈现和命名，但是斑马是活的，斑马线是非生物。
同样，”JSON”全名”JavaScript Object Notation”，所以它的格式（语法）是基于JS的，但它就是一种格式，而JS对象是一个实例，是存在于内存的一个东西。
说句玩笑话，如果JSON是基于PHP的，可能就叫PON了，形式可能就是这样的了['propertyOne' => 'foo', 'propertyTwo' => 42,]，如果这样，那么JSON可能现在是和PHP比较密切了。
此外，JSON是可以传输的，因为它是文本格式，但是JS对象是没办法传输的，在语法上，JSON也会更加严格，但是JS对象就很松了。
那么两个不同的东西为什么那么密切，因为JSON毕竟是从JS中演变出来的，语法相近。
2. JSON格式别JS对象语法表现上严格在哪
先就以“键值对为表现的对象”形式上，对比下两者的不同，至于JSON还能以怎样的形式表现，对比完后再罗列。
对比内容 JSON JS对象
键名 必须是加双引号 可允许不加、加单引号、加双引号
属性值 只能是数值（10进制）、字符串（双引号）、布尔值和null，也可以是数组或者符合JSON要求的对象，不能是函数、NaN, Infinity, -Infinity和undefined 爱啥啥
逗号问题 最后一个属性后面不能有逗号 可以
数值 前导0不能用，小数点后必须有数字 没限制
可以看到，相对于JS对象，JSON的格式更严格，所以大部分写的JS对象是不符合JSON的格式的。
以下代码引用自这里
var obj1 = {}; // 这只是 JS 对象// 可把这个称做：JSON 格式的 JavaScript 对象 var obj2 = {"width":100,"height":200,"name":"rose"};// 可把这个称做：JSON 格式的字符串var str1 = '{"width":100,"height":200,"name":"rose"}';// 这个可叫 JSON 格式的数组，是 JSON 的稍复杂一点的形式var arr = [ {"width":100,"height":200,"name":"rose"}, {"width":100,"height":200,"name":"rose"}, {"width":100,"height":200,"name":"rose"},];// 这个可叫稍复杂一点的 JSON 格式的字符串 var str2='['+ '{"width":100,"height":200,"name":"rose"},'+ '{"width":100,"height":200,"name":"rose"},'+ '{"width":100,"height":200,"name":"rose"},'+']';
另外，除了常见的“正常的”JSON格式，要么表现为一个对象形式{...}，要么表现为一个数组形式[...]，任何单独的一个10进制数值、双引号字符串、布尔值和null都是有效符合JSON格式的。
这里有完整的JSON语法参考
3. 一个有意思的地方，JSON不是JS的子集
首先看下面的代码，你可以copy到控制台执行下：
var code = '"\u2028\u2029"'; JSON.parse(code); // works fine eval(code); // fails
这两个字符\u2028和\u2029分别表示行分隔符和段落分隔符，JSON.parse可以正常解析，但是当做js解析时会报错。
三、这几个JS中的JSON函数，弄啥嘞
在JS中我们主要会接触到两个和JSON相关的函数，分别用于JSON字符串和JS数据结构之间的转化，一个叫JSON.stringify，它很聪明，聪明到你写的不符合JSON格式的JS对象都能帮你处理成符合JSON格式的字符串，所以你得知道它到底干了什么，免得它只是自作聪明，然后让你Debug long time；另一个叫JSON.parse，用于转化json字符串到JS数据结构，它很严格，你的JSON字符串如果构造地不对，是没办法解析的。
而它们的参数不止一个，虽然我们经常用的时候只传入一个参数。
此外，还有一个toJSON函数，我们较少看到，但是它会影响JSON.stringify。
1. 将JS数据结构转化为JSON字符串——JSON.stringify
这个函数的函数签名是这样的：
JSON.stringify(value[, replacer [, space]])
下面将分别展开带1~3个参数的用法，最后是它在序列化时做的一些“聪明”的事，要特别注意。
1.1 基本使用——仅需一个参数
这个大家都会使用，传入一个JSON格式的JS对象或者数组，JSON.stringify({"name":"Good Man","age":18})返回一个字符串"{"name":"Good Man","age":18}"。
可以看到本身我们传入的这个JS对象就是符合JSON格式的，用的双引号，也没有JSON不接受的属性值，那么如果像开头那个例子中的一样，how to play？不急，我们先举简单的例子来说明这个函数的几个参数的意义，再来说这个问题。
1.2 第二个参数可以是函数，也可以是一个数组
如果第二个参数是一个函数，那么序列化过程中的每个属性都会被这个函数转化和处理
如果第二个参数是一个数组，那么只有包含在这个数组中的属性才会被序列化到最终的JSON字符串中
如果第二个参数是null，那作用上和空着没啥区别，但是不想设置第二个参数，只是想设置第三个参数的时候，就可以设置第二个参数为null
这第二个参数若是函数
var friend={ "firstName": "Good", "lastName": "Man", "phone":"{{1234567:0}}", "age":18};var friendAfter=JSON.stringify(friend,function(key,value){ if(key==="phone") return "(000)"+value; else if(typeof value === "number") return value + 10; else return value; //如果你把这个else分句删除，那么结果会是undefined});console.log(friendAfter); //输出：{"firstName":"Good","lastName":"Man","phone":"(000){{1234567:0}}","age":28}
如果制定了第二个参数是函数，那么这个函数必须对每一项都有返回，这个函数接受两个参数，一个键名，一个是属性值，函数必须针对每一个原来的属性值都要有新属性值的返回。
那么问题来了，如果传入的不是键值对的对象形式，而是方括号的数组形式呢？，比如上面的friend变成这样：friend=["Jack","Rose"]，那么这个逐属性处理的函数接收到的key和value又是什么？如果是数组形式，那么key是索引，而value是这个数组项，你可以在控制台在这个函数内部打印出来这个key和value验证。
这第二个参数若是数组
var friend={ "firstName": "Good", "lastName": "Man", "phone":"{{1234567:0}}", "age":18};//注意下面的数组有一个值并不是上面对象的任何一个属性名var friendAfter=JSON.stringify(friend,["firstName","address","phone"]);console.log(friendAfter); //{"firstName":"Good","phone":"{{1234567:0}}"}//指定的“address”由于没有在原来的对象中找到而被忽略
如果第二个参数是一个数组，那么只有在数组中出现的属性才会被序列化进结果字符串，只要在这个提供的数组中找不到的属性就不会被包含进去，而这个数组中存在但是源JS对象中不存在的属性会被忽略，不会报错。
var friend={ firstName: 'Good', 'lastName': 'Man', 'address': undefined, 'phone': ["{{1234567:0}}",undefined], 'fullName': function(){ return this.firstName + ' ' + this.lastName; }};JSON.stringify(friend);//这一行返回什么呢？
第二个问题，如果我想在最终JSON字符串将这个’friend’的姓名全部变成大写字母，也就是把”Good”变成”GOOD”，把”Man”变成”MAN”，那么可以怎么做？
基于以上两个问题，我们再追本溯源问一下，JSON究竟是什么东西？为什么JSON就是易于数据交换？JSON和JS对象的区别？JS中JSON.parse、JSON.stringify和不常见的toJSON，这几个函数的参数和处理细节到底是怎样的？
欢迎进入本次“深挖JSON之旅”，下文将从以下几个方面去理解JSON：
首先是对“JSON是一种轻量的数据交换格式”的理解；
然后来看经常被混为一谈的JSON和JS对象的区别；
最后我们再来看JS中这几个JSON相关函数具体的执行细节。
希望全文能让如之前的我一样对JSON一知半解的亲能说清楚JSON是什么，也能熟练运用JSON，不看控制台就知道JS对象序列化成JSON字符串后输出是啥。
一、JSON是一种格式，基于文本，优于轻量，用于交换数据
如果没有去过JSON的官方介绍可以去一下这里，官方介绍第一、二段已经很清楚地表述了JSON是什么，我将JSON是什么提炼成以下几个方面：
1. 一种数据格式
什么是格式？就是规范你的数据要怎么表示，举个栗子，有个人叫“二百六”，身高“160cm”，体重“60kg”，现在你要将这个人的这些信息传给别人或者别的什么东西，你有很多种选择：
姓名“二百六”，身高“160cm”，体重“60kg”
name="二百六"&height="160cm"&weight="60kg"
<person><name>二百六</name><height>160</height><weight>60</weight></person>
{"name":"二百六","height":160,"weight":60}
… …
以上所有选择，传递的数据是一样的，但是你可以看到形式是可以各式各样的，这就是各种不同格式化后的数据，JSON是其中一种表示方式。
2. 基于文本的数据格式
JSON是基于文本的数据格式，相对于基于二进制的数据，所以JSON在传递的时候是传递符合JSON这种格式(至于JSON的格式是什么我们第二部分再说)的字符串，我们常会称为“JSON字符串”。
3. 轻量级的数据格式
在JSON之前，有一个数据格式叫xml，现在还是广泛在用，但是JSON更加轻量，如xml需要用到很多标签，像上面的例子中，你可以明显看到xml格式的数据中标签本身占据了很多空间，而JSON比较轻量，即相同数据，以JSON的格式占据的带宽更小，这在有大量数据请求和传递的情况下是有明显优势的。
4. 被广泛地用于数据交换
轻量已经是一个用于数据交换的优势了，但更重要的JSON是易于阅读、编写和机器解析的，即这个JSON对人和机器都是友好的，而且又轻，独立于语言（因为是基于文本的），所以JSON被广泛用于数据交换。
以前端JS进行ajax的POST请求为例，后端PHP处理请求为例：
前端构造一个JS对象，用于包装要传递的数据，然后将JS对象转化为JSON字符串，再发送请求到后端；
后端PHP接收到这个JSON字符串，将JSON字符串转化为PHP对象，然后处理请求。
可以看到，相同的数据在这里有3种不同的表现形式，分别是前端的JS对象、传输的JSON字符串、后端的PHP对象，JS对象和PHP对象明显不是一个东西，但是由于大家用的都是JSON来传递数据，大家都能理解这种数据格式，都能把JSON这种数据格式很容易地转化为自己能理解的数据结构，这就方便啦，在其他各种语言环境中交换数据都是如此。
二、JSON和JS对象之间的“八卦”
很多时候都听到“JSON是JS的一个子集”这句话，而且这句话我曾经也一直这么认为，每个符合JSON格式的字符串你解析成js都是可以的，直到后来发现了一个奇奇怪怪的东西…
1. 两个本质不同的东西为什么那么密切
JSON和JS对象本质上完全不是同一个东西，就像“斑马线”和“斑马”，“斑马线”基于“斑马”身上的条纹来呈现和命名，但是斑马是活的，斑马线是非生物。
同样，”JSON”全名”JavaScript Object Notation”，所以它的格式（语法）是基于JS的，但它就是一种格式，而JS对象是一个实例，是存在于内存的一个东西。
说句玩笑话，如果JSON是基于PHP的，可能就叫PON了，形式可能就是这样的了['propertyOne' => 'foo', 'propertyTwo' => 42,]，如果这样，那么JSON可能现在是和PHP比较密切了。
此外，JSON是可以传输的，因为它是文本格式，但是JS对象是没办法传输的，在语法上，JSON也会更加严格，但是JS对象就很松了。
那么两个不同的东西为什么那么密切，因为JSON毕竟是从JS中演变出来的，语法相近。
2. JSON格式别JS对象语法表现上严格在哪
先就以“键值对为表现的对象”形式上，对比下两者的不同，至于JSON还能以怎样的形式表现，对比完后再罗列。
对比内容 JSON JS对象
键名 必须是加双引号 可允许不加、加单引号、加双引号
属性值 只能是数值（10进制）、字符串（双引号）、布尔值和null，也可以是数组或者符合JSON要求的对象，不能是函数、NaN, Infinity, -Infinity和undefined 爱啥啥
逗号问题 最后一个属性后面不能有逗号 可以
数值 前导0不能用，小数点后必须有数字 没限制
可以看到，相对于JS对象，JSON的格式更严格，所以大部分写的JS对象是不符合JSON的格式的。
以下代码引用自这里
var obj1 = {}; // 这只是 JS 对象// 可把这个称做：JSON 格式的 JavaScript 对象 var obj2 = {"width":100,"height":200,"name":"rose"};// 可把这个称做：JSON 格式的字符串var str1 = '{"width":100,"height":200,"name":"rose"}';// 这个可叫 JSON 格式的数组，是 JSON 的稍复杂一点的形式var arr = [ {"width":100,"height":200,"name":"rose"}, {"width":100,"height":200,"name":"rose"}, {"width":100,"height":200,"name":"rose"},];// 这个可叫稍复杂一点的 JSON 格式的字符串 var str2='['+ '{"width":100,"height":200,"name":"rose"},'+ '{"width":100,"height":200,"name":"rose"},'+ '{"width":100,"height":200,"name":"rose"},'+']';
另外，除了常见的“正常的”JSON格式，要么表现为一个对象形式{...}，要么表现为一个数组形式[...]，任何单独的一个10进制数值、双引号字符串、布尔值和null都是有效符合JSON格式的。
这里有完整的JSON语法参考
3. 一个有意思的地方，JSON不是JS的子集
首先看下面的代码，你可以copy到控制台执行下：
var code = '"\u2028\u2029"'; JSON.parse(code); // works fine eval(code); // fails
这两个字符\u2028和\u2029分别表示行分隔符和段落分隔符，JSON.parse可以正常解析，但是当做js解析时会报错。
三、这几个JS中的JSON函数，弄啥嘞
在JS中我们主要会接触到两个和JSON相关的函数，分别用于JSON字符串和JS数据结构之间的转化，一个叫JSON.stringify，它很聪明，聪明到你写的不符合JSON格式的JS对象都能帮你处理成符合JSON格式的字符串，所以你得知道它到底干了什么，免得它只是自作聪明，然后让你Debug long time；另一个叫JSON.parse，用于转化json字符串到JS数据结构，它很严格，你的JSON字符串如果构造地不对，是没办法解析的。
而它们的参数不止一个，虽然我们经常用的时候只传入一个参数。
此外，还有一个toJSON函数，我们较少看到，但是它会影响JSON.stringify。
1. 将JS数据结构转化为JSON字符串——JSON.stringify
这个函数的函数签名是这样的：
JSON.stringify(value[, replacer [, space]])
下面将分别展开带1~3个参数的用法，最后是它在序列化时做的一些“聪明”的事，要特别注意。
1.1 基本使用——仅需一个参数
这个大家都会使用，传入一个JSON格式的JS对象或者数组，JSON.stringify({"name":"Good Man","age":18})返回一个字符串"{"name":"Good Man","age":18}"。
可以看到本身我们传入的这个JS对象就是符合JSON格式的，用的双引号，也没有JSON不接受的属性值，那么如果像开头那个例子中的一样，how to play？不急，我们先举简单的例子来说明这个函数的几个参数的意义，再来说这个问题。
1.2 第二个参数可以是函数，也可以是一个数组
如果第二个参数是一个函数，那么序列化过程中的每个属性都会被这个函数转化和处理
如果第二个参数是一个数组，那么只有包含在这个数组中的属性才会被序列化到最终的JSON字符串中
如果第二个参数是null，那作用上和空着没啥区别，但是不想设置第二个参数，只是想设置第三个参数的时候，就可以设置第二个参数为null
这第二个参数若是函数
var friend={ "firstName": "Good", "lastName": "Man", "phone":"{{1234567:0}}", "age":18};var friendAfter=JSON.stringify(friend,function(key,value){ if(key==="phone") return "(000)"+value; else if(typeof value === "number") return value + 10; else return value; //如果你把这个else分句删除，那么结果会是undefined});console.log(friendAfter); //输出：{"firstName":"Good","lastName":"Man","phone":"(000){{1234567:0}}","age":28}
如果制定了第二个参数是函数，那么这个函数必须对每一项都有返回，这个函数接受两个参数，一个键名，一个是属性值，函数必须针对每一个原来的属性值都要有新属性值的返回。
那么问题来了，如果传入的不是键值对的对象形式，而是方括号的数组形式呢？，比如上面的friend变成这样：friend=["Jack","Rose"]，那么这个逐属性处理的函数接收到的key和value又是什么？如果是数组形式，那么key是索引，而value是这个数组项，你可以在控制台在这个函数内部打印出来这个key和value验证。
这第二个参数若是数组
var friend={ "firstName": "Good", "lastName": "Man", "phone":"{{1234567:0}}", "age":18};//注意下面的数组有一个值并不是上面对象的任何一个属性名var friendAfter=JSON.stringify(friend,["firstName","address","phone"]);console.log(friendAfter); //{"firstName":"Good","phone":"{{1234567:0}}"}//指定的“address”由于没有在原来的对象中找到而被忽略
如果第二个参数是一个数组，那么只有在数组中出现的属性才会被序列化进结果字符串，只要在这个提供的数组中找不到的属性就不会被包含进去，而这个数组中存在但是源JS对象中不存在的属性会被忽略，不会报错。
