您会意识,长远精晓

深入明白 JSON

2017/03/29 · JavaScript
· 2 评论 ·
JSON

原文出处:
Apriltail   

咱俩先来看一个JS中广泛的JS对象连串化成JSON字符串的难题,请问,以下JS对象通过JSON.stringify后的字符串是什么样的?先不用急着复制粘贴到控制台,先自己打开一个代码编辑器或者纸,写写看,写完再去仔细比较你的操纵台出口,假若有误记得看完全文并评论,哈哈。

JavaScript

var friend={ firstName: ‘Good’, ‘lastName’: ‘Man’, ‘address’: undefined,
‘phone’: [“1234567”,undefined], ‘fullName’: function(){ return
this.firstName + ‘ ‘ + this.lastName; } };
JSON.stringify(friend);//这一行重临什么啊?

1
2
3
4
5
6
7
8
9
10
11
var friend={  
    firstName: ‘Good’,
    ‘lastName’: ‘Man’,
    ‘address’: undefined,
    ‘phone’: ["1234567",undefined],
    ‘fullName’: function(){
        return this.firstName + ‘ ‘ + this.lastName;
    }
};
 
JSON.stringify(friend);//这一行返回什么呢?

首个难题,倘若我想在终极JSON字符串将以此’friend’的姓名全体改成大写字母,也就是把”Good”变成”GOOD”,把”Man”变成”MAN”,那么可以如何是好?

据悉上述多少个难题,我们再追本溯源问一下,JSON究竟是怎样事物?为何JSON就是便于数据调换?JSON和JS对象的分别?JS中JSON.parseJSON.stringify和不普遍的toJSON,那多少个函数的参数和处理细节到底是何许的?

迎接进入这次“深挖JSON之旅”,下文将从以下几个地点去精通JSON:

  • 率先是对“JSON是一种轻量的数据沟通格式”的知道;
  • 然后来看平常被混为一谈的JSON和JS对象的分别;
  • 末尾大家再来看JS中那多少个JSON相关函数具体的推行细节。

期望全文能让如此前的本人一样对JSON管窥之见的亲能说清楚JSON是如何,也能自如使用JSON,不看控制台就掌握JS对象系列化成JSON字符串后输出是啥。

俺们先来看一个JS中常见的JS对象体系化成JSON字符串的难点,请问,以下JS对象通过JSON.stringify后的字符串是怎么着的?先不要急着复制粘贴到控制台,先自己打开一个代码编辑器或者纸,写写看,写完再去仔细比较你的主宰台出口,如若有误记得看完全文并评论,哈哈。

转发网址:

一、什么是json?

一、JSON是一种格式,基于文本,优于轻量,用于互换数据

假如没有去过JSON的合法介绍可以去一下那边,官方介绍第一、二段已经很驾驭地表明了JSON是何等,我将JSON是何许提炼成以下多少个方面:

var friend={
    firstName: 'Good',
    'lastName': 'Man',
    'address': undefined,
    'phone': ["1234567",undefined],
    'fullName': function(){
        return this.firstName + ' ' + this.lastName;
    }
};

JSON.stringify(friend);//这一行返回什么呢?

 

json英文全称 JavaScript Object 您会意识,长远精晓。Notation,是一种易于领会的轻量级数据沟通格式。

1. 一种多少格式

何以是格式?就是专业你的多寡要怎么表示,举个栗子,有私房叫“二百六”,身高“160cm”,体重“60kg”,现在您要将以此人的这一个音信传给外人或者其他什么事物,你有很多样抉择:

  • 姓名“二百六”,身高“160cm”,体重“60kg”
  • name="二百六"&height="160cm"&weight="60kg"
  • 二百六16060
  • {"name":"二百六","height":160,"weight":60}
  • … …

上述所有选择,传递的数目是相同的,不过你可以看出格局是足以各式各种的,那就是种种不一样格式化后的数额,JSON是内部一种象征方法。

第四个难题,若是自己想在结尾JSON字符串将以此’friend’的全名全体化为大写字母,也就是把”Good”变成”GOOD”,把”Man”变成”MAN”,那么可以如何做?

咱俩先来看一个JS中广泛的JS对象体系化成JSON字符串的难题。

JSON 成效:用于存储和传输数据的格式。 寻常用于服务端向网页传递数据 。

2. 基于文本的多少格式

JSON是依据文本的数量格式,相对于按照二进制的数目,所以JSON在传递的时候是传递符合JSON那种格式(至于JSON的格式是何许大家第二局地加以)的字符串,我们常会称呼“JSON字符串”。

依照以上四个难题,大家再追本溯源问一下,JSON究竟是怎么样事物?为啥JSON就是便于数据互换?JSON和JS对象的区分?JS中JSON.parseJSON.stringify和不广泛的toJSON,那多少个函数的参数和处理细节到底是如何的?

请问:以下JS对象通过JSON.stringify后的字符串是何许的?

二、语法规则

3. 轻量级的多寡格式

在JSON从前,有一个数码格式叫xml,现在仍然广大在用,不过JSON尤其轻量,如xml亟待利用很多标签,像下边的例证中,你能够一目通晓看出xml格式的多少中标签我占据了成百上千空间,而JSON相比轻量,即一律数量,以JSON的格式占据的带宽更小,这在有大气数额请求和传递的情景下是有肯定优势的。

欢迎进入本次“深挖JSON之旅”,下文将从以下多少个地点去精晓JSON:

(先不要急着复制粘贴到控制台,先自己打开一个代码编辑器或者纸,写写看,写完再去仔细比较你的操纵台出口,假使有误记得看完全文并评价,哈哈。)

  • 数据为 键/值 对。
  • 数码由逗号分隔。
  • 大括号保存对象
  • 方括号保存数组

4. 被大面积地用来数据沟通

轻量已经是一个用于数据互换的优势了,但更要紧的JSON是简单阅读、编写和机具解析的,即那一个JSON对人和机器都是祥和的,而且又轻,独立于言语(因为是根据文本的),所以JSON被普遍用于数据调换。

原先端JS进行ajax的POST请求为例,后端PHP处理请求为例:

  1. 前端构造一个JS对象,用于包装要传送的数目,然后将JS对象转化为JSON字符串,再发送请求到后端;
  2. 后端PHP接收到那些JSON字符串,将JSON字符串转化为PHP对象,然后处理请求。

可以看到,相同的数额在那边有3种分化的表现方式,分别是前者的JS对象、传输的JSON字符串、后端的PHP对象,JS对象和PHP对象显明不是一个东西,但是由于我们用的都是JSON来传递数据,大家都能知晓那种数据格式,都能把JSON那种数据格式很简单地转车为投机能知道的数据结构,这就便于啊,在此外各个语言环境中交流数据都是那般。

  • 率先是对“JSON是一种轻量的数据调换格式”的通晓;

  • 下一场来看常常被混为一谈的JSON和JS对象的差异;

  • 最后我们再来看JS中那多少个JSON相关函数具体的实施细节。

亚洲必赢官网 1

  json对象的代码示例:

二、JSON和JS对象之间的“八卦”

多多时候都听见“JSON是JS的一个子集”那句话,而且那句话我早就也直接如此认为,每个符合JSON格式的字符串你解析成js都是足以的,直到后来察觉了一个奇奇怪怪的东西…

仰望全文能让如此前的我一样对JSON管窥之见的亲能说清楚JSON是怎么样,也能运用自如应用JSON,不看控制台就驾驭JS对象体系化成JSON字符串后输出是甚。

其次个难点,如果自己想在结尾JSON字符串将以此’friend’的全名整体改为大写字母,也就是把”Good”变成”GOOD”,把”Man”变成”MAN”,那么可以咋做?

  {“firstName”:”John”, “lastName”:”Doe”}

1. 三个精神区其他东西怎么那么精心

JSON和JS对象本质上完全不是同一个事物,如同“斑马线”和“斑马”,“斑马线”基于“斑马”身上的条纹来表现和命名,不过斑马是活的,斑马线是非生物。

一样,”JSON”全名”JavaScript Object
Notation”,所以它的格式(语法)是按照JS的,但它就是一种格式,而JS对象是一个实例,是存在于内存的一个事物。

说句玩笑话,如若JSON是依照PHP的,可能就叫PON了,方式可能就是那般的了['propertyOne' => 'foo', 'propertyTwo' => 42,],即使那样,那么JSON可能现在是和PHP相比较密切了。

其它,JSON是足以传输的,因为它是文本格式,不过JS对象是不可能传输的,在语法上,JSON也会越发严酷,但是JS对象就很松了。

那么四个区其余东西怎么那么精心,因为JSON毕竟是从JS中衍生和变化出来的,语法相近。

一、JSON是一种格式,基于文本,优于轻量,用于交流数据

一旦没有去过JSON的法定介绍可以去一下那里,官方介绍第一、二段已经很理解地发挥了JSON是什么,我将JSON是怎么样提炼成以下多少个方面:

根据以上多少个难题,大家再追本溯源问一下:

  json数组的代码示例:

2. JSON格式别JS对象语法表现上严俊在哪

先就以“键值对为表现的目的”情势上,相比较下互相的例外,至于JSON还可以以什么的样式显示,相比完后再罗列。

对比内容 JSON JS对象
键名 必须是加双引号 可允许不加、加单引号、加双引号
属性值 只能是数值(10进制)、字符串(双引号)、布尔值和null,
也可以是数组或者符合JSON要求的对象,
不能是函数、NaN, Infinity, -Infinity和undefined
爱啥啥
逗号问题 最后一个属性后面不能有逗号 可以
数值 前导0不能用,小数点后必须有数字 没限制

可以观望,相对于JS对象,JSON的格式更严峻,所以超过半数写的JS对象是不适合JSON的格式的。

以下代码引用自这里

JavaScript

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”},’+ ‘]’;

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
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语法参考

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是其中一种象征方法。

  • JSON究竟是如何事物?
  • 为啥JSON就是便于数据交流?
  • JSON和JS对象的区分?
  • JS中JSON.parse、JSON.stringify和不常见的toJSON,那多少个函数的参数和处理细节到底是怎么的?

  ”employees”:[
    {“firstName”:”John”, “lastName”:”Doe”}, 
    {“firstName”:”Anna”, “lastName”:”Smith”}, 
    {“firstName”:”Peter”, “lastName”:”Jones”}
  ]

3. 一个妙趣横生的地方,JSON不是JS的子集

先是看上面的代码,你可以copy到控制台执行下:

JavaScript

var code = ‘”u2028u2029″‘; JSON.parse(code); // works fine eval(code);
// fails

1
2
3
var code = ‘"u2028u2029"’;  
JSON.parse(code); // works fine  
eval(code); // fails

那一个字符u2028u2029分别代表行分隔符和段落分隔符,JSON.parse可以健康解析,可是作为js解析时会报错。

2. 基于文本的数据格式

JSON是基于文本的数码格式,相对于根据二进制的数额,所以JSON在传递的时候是传递符合JSON那种格式(至于JSON的格式是什么样大家第二部分再说)的字符串,大家常会称呼“JSON字符串”。

欢迎进入本次“深挖JSON之旅”,下文将从以下多少个方面去领略JSON:

三、json的操作

三、这几个JS中的JSON函数,弄啥嘞

在JS中大家首要会接触到多少个和JSON相关的函数,分别用于JSON字符串和JS数据结构之间的转化,一个叫JSON.stringify,它很聪明,聪明到你写的不切合JSON格式的JS对象都能帮您处理成符合JSON格式的字符串,所以您得领会它究竟干了哪些,免得它只是布鼓雷门,然后让你Debug
long
time;另一个叫JSON.parse,用于转化json字符串到JS数据结构,它很严谨,你的JSON字符串倘使协会地不对,是不可以解析的。

而它们的参数不止一个,即便大家日常用的时候只传入一个参数。

别的,还有一个toJSON函数,我们较少见到,不过它会影响JSON.stringify

3. 轻量级的数据格式

在JSON从前,有一个数量格式叫xml,现在如故大规模在用,可是JSON越发轻量,如xml急需采用很多标签,像上边的事例中,你可以肯定看出xml格式的多少中标签我占据了成百上千上空,而JSON相比较轻量,即一律数量,以JSON的格式占据的带宽更小,那在有大气数目请求和传递的情景下是有强烈优势的。

  • 第一是对“JSON是一种轻量的数据互换格式”的知情;
  • 下一场来看日常被混为一谈的JSON和JS对象的分别;
  • 终极大家再来看JS中那多少个JSON相关函数具体的实施细节。

  JSON 最广泛的用法之一,是从 web 服务器上读取 JSON
数据(作为文件或当作 HttpRequest),将 JSON 数据转换为 JavaScript
对象,然后在网页中采纳该数据。

1. 将JS数据结构转化为JSON字符串——JSON.stringify

那一个函数的函数签名是这样的:

JavaScript

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

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

上面将各自展开带1~3个参数的用法,最终是它在体系化时做的一对“聪明”的事,要尤其注意。

4. 被周边地用来数据互换

轻量已经是一个用来数据调换的优势了,但更主要的JSON是不难阅读、编写和机具解析的,即那一个JSON对人和机器都是投机的,而且又轻,独立于言语(因为是基于文本的),所以JSON被大面积用于数据交流。

在此此前端JS举办ajax的POST请求为例,后端PHP处理请求为例:

  1. 前者构造一个JS对象,用于包装要传递的数量,然后将JS对象转化为JSON字符串,再发送请求到后端;

  2. 后端PHP接收到那么些JSON字符串,将JSON字符串转化为PHP对象,然后处理请求。

可以看到,相同的多少在那里有3种分裂的表现格局,分别是前者的JS对象、传输的JSON字符串、后端的PHP对象,JS对象和PHP对象明显不是一个事物,然则由于大家用的都是JSON来传递数据,我们都能领略那种数量格式,都能把JSON那种数量格式很简单地倒车为投机能清楚的数据结构,那就便宜啊,在其他各样语言环境中沟通数据都是这么。

梦想全文能让如此前的本身一样对JSON孤陋寡闻的亲能说清楚JSON是何等,也能熟稔应用JSON,不看控制台就理解JS对象种类化成JSON字符串后输出是啥。

  相关代码示例:

1.1 基本选拔——仅需一个参数

本条大家都会动用,传入一个JSON格式的JS对象或者数组,JSON.stringify({"name":"Good Man","age":18})再次来到一个字符串"{"name":"Good Man","age":18}"

可以看看我大家传入的这一个JS对象就是顺应JSON格式的,用的双引号,也未曾JSON不接受的属性值,那么只要像开头那一个例子中的一样,how
to
play?不急,大家先举简单的例子来验证那一个函数的多少个参数的含义,再来说这几个题材。

二、JSON和JS对象之间的“八卦”

过多时候都听到“JSON是JS的一个子集”那句话,而且那句话我早就也直接如此觉得,每个符合JSON格式的字符串你解析成js都是可以的,直到后来发现了一个奇奇怪怪的东西…

JSON 是一种格式

  <!DOCTYPE html>
  <html>
    <head>
      <meta charset=”utf-8″>
      <title>菜鸟教程(runoob.com)</title>
    </head>
    <body>
      <h2>从 JSON 字符串中创立对象</h2>
      <p>
        名: <span id=”fname”></span><br>
        姓: <span id=”lname”></span><br>
      </p>
      <script>
        var txt = ‘{“employees”:[‘ +
        '{“firstName”:”John”,”lastName”:”Doe” },’ +
        '{“firstName”:”Anna”,”lastName”:”Smith” },’ +
        '{“firstName”:”Peter”,”lastName”:”Jones” }]}’;

1.2 第一个参数可以是函数,也可以是一个数组

  • 若是第一个参数是一个函数,那么体系化进程中的每个属性都会被那些函数转化和处理
  • 借使首个参数是一个数组,那么唯有隐含在那一个数组中的属性才会被体系化到终极的JSON字符串中
  • 若是第一个参数是null,那作用上和空着没啥不一致,不过不想设置第一个参数,只是想设置第七个参数的时候,就足以设置第四个参数为null

那第一个参数假使函数

JavaScript

var friend={ “firstName”: “Good”, “lastName”: “Man”, “phone”:”1234567″,
“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″,”age”:28}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
var friend={  
    "firstName": "Good",
    "lastName": "Man",
    "phone":"1234567",
    "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","age":28}

比方制定了第一个参数是函数,那么那个函数必须对每一项都有再次回到,那几个函数接受八个参数,一个键名,一个是属性值,函数必须针对每一个原先的属性值都要有新属性值的回到。

那就是说难题来了,即使传入的不是键值对的靶子方式,而是方括号的数组形式吗?,比如上面的friend变成那样:friend=["Jack","Rose"],那么那些逐属性处理的函数接收到的key和value又是哪些?即使是数组方式,那么key是索引,而value是这几个数组项,你可以在控制台在这几个函数内部打印出来这几个key和value验证。

那第一个参数即使数组

JavaScript

var friend={ “firstName”: “Good”, “lastName”: “Man”, “phone”:”1234567″,
“age”:18 }; //注意上面的数组有一个值并不是上边对象的其余一个性质名 var
friendAfter=JSON.stringify(friend,[“firstName”,”address”,”phone”]);
console.log(friendAfter); //{“firstName”:”Good”,”phone”:”1234567″}
//指定的“address”由于尚未在原先的目标中找到而被忽视

1
2
3
4
5
6
7
8
9
10
11
12
13
var friend={  
    "firstName": "Good",
    "lastName": "Man",
    "phone":"1234567",
    "age":18
};
 
//注意下面的数组有一个值并不是上面对象的任何一个属性名
var friendAfter=JSON.stringify(friend,["firstName","address","phone"]);
 
console.log(friendAfter);  
//{"firstName":"Good","phone":"1234567"}
//指定的“address”由于没有在原来的对象中找到而被忽略

要是第四个参数是一个数组,那么唯有在数组中出现的性质才会被序列化进结果字符串,只要在这一个提供的数组中找不到的特性就不会被含有进去,而以此数组中设有可是源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中演化出来的,语法相近。

– 基于文本,优于轻量,用于交流数据

        var obj = eval (“(” + txt + “)”);

1.3 第四个参数用于美化输出——不提出用

指定缩进用的空白字符,可以取以下多少个值:

  • 是1-10的某个数字,代表用多少个空白字符
  • 是字符串的话,就用该字符串代替空格,最多取那些字符串的前10个字符
  • 平昔不提供该参数 等于 设置成null 等于 设置一个低于1的数

JavaScript

var friend={ “firstName”: “Good”, “lastName”: “Man”,
“phone”:{“home”:”1234567″,”work”:”7654321″} }; //直接转化是那般的:
//{“firstName”:”Good”,”lastName”:”Man”,”phone”:{“home”:”1234567″,”work”:”7654321″}}
var friendAfter=JSON.stringify(friend,null,4); console.log(friendAfter);
/* { “firstName”: “Good”, “lastName”: “Man”, “phone”: { “home”:
“1234567”, “work”: “7654321” } } */ var
friendAfter=JSON.stringify(friend,null,”HAHAHAHA”);
console.log(friendAfter); /* { HAHAHAHA”firstName”: “Good”,
HAHAHAHA”lastName”: “Man”, HAHAHAHA”phone”: { HAHAHAHAHAHAHAHA”home”:
“1234567”, HAHAHAHAHAHAHAHA”work”: “7654321” HAHAHAHA} } */ var
friendAfter=JSON.stringify(friend,null,”WhatAreYouDoingNow”);
console.log(friendAfter); /* 最四只取10个字符 { WhatAreYou”firstName”:
“Good”, WhatAreYou”lastName”: “Man”, WhatAreYou”phone”: {
WhatAreYouWhatAreYou”home”: “1234567”, WhatAreYouWhatAreYou”work”:
“7654321” WhatAreYou} } */

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
var friend={  
    "firstName": "Good",
    "lastName": "Man",
    "phone":{"home":"1234567","work":"7654321"}
};
 
//直接转化是这样的:
//{"firstName":"Good","lastName":"Man","phone":{"home":"1234567","work":"7654321"}}
 
var friendAfter=JSON.stringify(friend,null,4);  
console.log(friendAfter);  
/*
{
    "firstName": "Good",
    "lastName": "Man",
    "phone": {
        "home": "1234567",
        "work": "7654321"
    }
}
*/
 
var friendAfter=JSON.stringify(friend,null,"HAHAHAHA");  
console.log(friendAfter);  
/*
{
HAHAHAHA"firstName": "Good",  
HAHAHAHA"lastName": "Man",  
HAHAHAHA"phone": {  
HAHAHAHAHAHAHAHA"home": "1234567",  
HAHAHAHAHAHAHAHA"work": "7654321"  
HAHAHAHA}  
}
*/
 
var friendAfter=JSON.stringify(friend,null,"WhatAreYouDoingNow");  
console.log(friendAfter);  
/* 最多只取10个字符
{
WhatAreYou"firstName": "Good",  
WhatAreYou"lastName": "Man",  
WhatAreYou"phone": {  
WhatAreYouWhatAreYou"home": "1234567",  
WhatAreYouWhatAreYou"work": "7654321"  
WhatAreYou}  
}
*/

笑笑就好,别这么用,连串化是为了传输,传输就是能越小越好,加岂有此理的缩进符,解析困难(即使是字符串的话),也削弱了轻量化那一个特点。

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语法参考

尽管没有去过JSON的法定介绍可以去一下那里,官方介绍第一、二段已经很领会地表述了JSON是如何,我将JSON是哪些提炼成以下多少个方面:

        document.getElementById(“fname”).innerHTML=obj.employees[1].firstName
        document.getElementById(“lname”).innerHTML=obj.employees[1].lastName
      </script>
     </body>
    </html>

1.4 注意那几个函数的“小智慧”(首要)

万一有任何不确定的情事,那么最好的方法就是”Have a
try”,控制台做下实验就明了。

  • 键名不是双引号的(包涵没有引号或者是单引号),会自行变成双引号;字符串是单引号的,会活动变成双引号
  • 末段一个特性前面有逗号的,会被机关去掉
  • 非数组对象的性质不可能确保以一定的次第现身在种类化后的字符串中
    这么些好明白,也就是对非数组对象在最后字符串中不有限支撑属性顺序和原来一样
  • 布尔值、数字、字符串的包裹对象在连串化进程中会自动转换成对应的原始值
    也就是你的怎么new String("bala")会变成"bala"new Number(2017)会变成2017
  • undefined、任意的函数(其实有个函数会发生神奇的事,前边会说)以及
    symbol 值(symbol详见ES6对symbol的介绍)

    • 出现在非数组对象的属性值中:在体系化进度中会被忽略
    • 出现在数组中时:被转换成 null

JavaScript

JSON.stringify({x: undefined, y: function(){return 1;}, z: Symbol(“”)});
//出现在非数组对象的属性值中被忽视:”{}” JSON.stringify([undefined,
Object, Symbol(“”)]);
//出现在数组对象的属性值中,变成null:”[null,null,null]”

1
2
3
4
JSON.stringify({x: undefined, y: function(){return 1;}, z: Symbol("")});  
//出现在非数组对象的属性值中被忽略:"{}"
JSON.stringify([undefined, Object, Symbol("")]);  
//出现在数组对象的属性值中,变成null:"[null,null,null]"
  • NaN、Infinity和-Infinity,不论在数组或者非数组的靶子中,都被转载为null
  • 有着以 symbol 为属性键的品质都会被全然忽略掉,即便 replacer
    参数中强制指定包含了它们
  • 成千上万的属性会被忽视

3. 一个好玩的地点,JSON不是JS的子集

率先看上边的代码,你可以copy到控制台执行下:

var code = '"\u2028\u2029"';
JSON.parse(code); // works fine
eval(code); // fails

那多个字符\u2028\u2029独家表示行分隔符和段落分隔符,JSON.parse可以健康解析,不过作为js解析时会报错。

1.一种多少格式

    JSON.parse() 方法用于将一个 JSON 字符串转换为目标。

2. 将JSON字符串解析为JS数据结构——JSON.parse

其一函数的函数签名是这么的:

JavaScript

JSON.parse(text[, reviver])

1
JSON.parse(text[, reviver])

假如第四个参数,即JSON字符串不是法定的字符串的话,那么那个函数会抛出荒谬,所以如若你在写一个后端再次来到JSON字符串的台本,最好调用语言本身的JSON字符串相关体系化函数,而只如若祥和去拼接达成的体系化字符串,那么就愈加要注意种类化后的字符串是或不是是合法的,法定指那个JSON字符串完全符合JSON必要的严峻格式

值得注意的是那里有一个可选的第四个参数,那一个参数必须是一个函数,这么些函数功用在性质已经被解析只是还没回来前,将质量处理后再重返。

亚洲必赢官网 ,JavaScript

var friend={ “firstName”: “Good”, “lastName”: “Man”,
“phone”:{“home”:”1234567″,”work”:[“7654321″,”999000”]} };
//大家先将其连串化 var friendAfter=JSON.stringify(friend);
//'{“firstName”:”Good”,”lastName”:”Man”,”phone”:{“home”:”1234567″,”work”:[“7654321″,”999000”]}}’
//再将其分析出来,在其次个参数的函数中打印出key和value
JSON.parse(friendAfter,function(k,v){ console.log(k); console.log(v);
console.log(“—-“); }); /* firstName Good —- lastName Man —- home
1234567 —- 0 7654321 —- 1 999000 —- work [] —- phone Object
—- Object —- */

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
var friend={  
    "firstName": "Good",
    "lastName": "Man",
    "phone":{"home":"1234567","work":["7654321","999000"]}
};
 
//我们先将其序列化
var friendAfter=JSON.stringify(friend);  
//'{"firstName":"Good","lastName":"Man","phone":{"home":"1234567","work":["7654321","999000"]}}’
 
//再将其解析出来,在第二个参数的函数中打印出key和value
JSON.parse(friendAfter,function(k,v){  
    console.log(k);
    console.log(v);
    console.log("—-");
});
/*
firstName  
Good  
—-
lastName  
Man  
—-
home  
1234567  
—-
0  
7654321  
—-
1  
999000  
—-
work  
[]
—-
phone  
Object  
—-
 
Object  
—-
*/

仔细看一下这个输出,可以窥见这么些遍历是由内而外的,可能由内而外那些词大家会误解,最里层是里面数组里的几个值啊,然则出口是从第四个特性开端的,怎么就是由内而外的吗?

本条由内而外指的是对于复合属性来说的,通俗地讲,遍历的时候,从头到尾举办遍历,假使是概括属性值(数值、字符串、布尔值和null),那么直接遍历达成,借使是赶上属性值是目的或者数组方式的,那么暂停,先遍历这么些子JSON,而遍历的尺码也是千篇一律的,等那几个复合属性遍历完成,那么再形成对这么些特性的遍历重返。

实质上,那就是一个纵深优先的遍历。

有两点要求专注:

  • 一经 reviver 再次回到undefined,则当前属性会从所属对象中去除,如若回去了其余值,则赶回的值会成为当前品质新的属性值。
  • 您可以小心到下面例子最终一组输出看上去没有key,其实那一个key是一个空字符串,而最后的object是终极解析完结目的,因为到了最上层,已经没有真正的属性了。

三、这几个JS中的JSON函数,弄啥嘞

在JS中大家任重(英文名:rèn zhòng)而道远会触发到八个和JSON相关的函数,分别用于JSON字符串和JS数据结构之间的转账,一个叫JSON.stringify,它很聪慧,聪明到你写的不合乎JSON格式的JS对象都能帮您处理成适合JSON格式的字符串,所以你得驾驭它究竟干了什么,免得它只是自作聪明,然后让你Debug
long
time;另一个叫JSON.parse,用于转化json字符串到JS数据结构,它很严格,你的JSON字符串借使社团地不对,是不可以解析的。

而它们的参数不止一个,即便大家平时用的时候只传入一个参数。

除此以外,还有一个toJSON函数,大家较少看到,但是它会潜移默化JSON.stringify

何以是格式?就是标准你的数额要怎么表示,举个栗子,有个体叫“二百六”,身高“160cm”,体重“60kg”,现在您要将以这厮的这一个音信传给旁人或者其他什么事物,你有很多种抉择:

    语法:JSON.parse(text[, reviver])

3. 影响 JSON.stringify 的神奇函数——object.toJSON

如若你在一个JS对象上完成了toJSON格局,那么调用JSON.stringify去系列化那个JS对象时,JSON.stringify会把这几个目标的toJSON艺术再次来到的值作为参数去开展体系化。

JavaScript

var info={ “msg”:”I Love You”, “toJSON”:function(){ var replaceMsg=new
Object(); replaceMsg[“msg”]=”Go Die”; return replaceMsg; } };
JSON.stringify(info); //出si了,重临的是:'”{“msg”:”Go
Die”}”‘,说好的忽视函数呢

1
2
3
4
5
6
7
8
9
10
11
var info={  
    "msg":"I Love You",
    "toJSON":function(){
        var replaceMsg=new Object();
        replaceMsg["msg"]="Go Die";
        return replaceMsg;
    }
};
 
JSON.stringify(info);  
//出si了,返回的是:’"{"msg":"Go Die"}"’,说好的忽略函数呢

其一函数就是那样子的。

其实Date项目可以平素传给JSON.stringify做参数,其中的道理就是,Date品类内置了toJSON方法。

1. 将JS数据结构转化为JSON字符串 —— JSON.stringify

本条函数的函数签名是那样的:

JSON.stringify(value[, replacer [, space]])
  • 姓名“二百六”,身高“160cm”,体重“60kg”
  • name=”二百六”&height=”160cm”&weight=”60kg”
  • <person><name>二百六</name><height>160</height><weight>60</weight></person>
  • {“name”:”二百六”,”height”:160,”weight”:60}
  • … …

    参数:

四、小结以及关于包容性的难点

到那边终于把,JSON和JS中的JSON,梳理了五次,也对内部的底细和专注点展开了一遍遍历,知道JSON是一种语法上衍生于JS语言的一种轻量级的数据交流格式,也了解了JSON相对于一般的JS数据结构(越发是目的)的差距,更进一步,仔细地商讨了JS中关于JSON处理的3个函数和细节。

但是遗憾的是,以上所用的3个函数,不包容IE7以及IE7以前的浏览器。有关包容性的议论,留待将来吧。如若想一贯在动用上缓解包容性,那么可以套用JSON官方的js,可以解决。

如有纰漏,欢迎留言提议。

1 赞 10 收藏 2
评论

亚洲必赢官网 2

1.1 基本使用 —— 仅需一个参数

本条大家都会选用,传入一个JSON格式的JS对象或者数组,JSON.stringify({"name":"Good Man","age":18})重返一个字符串"{"name":"Good Man","age":18}"

可以见见我大家传入的这几个JS对象就是符合JSON格式的,用的双引号,也尚无JSON不收受的属性值,那么只要像开端那些例子中的一样,how
to
play?不急,我们先举简单的例证来表明那几个函数的多少个参数的意义,再来说这些题材。

上述所有选拔,传递的多少是同等的,不过你可以看看形式是足以各式各类的,那就是各样不相同格式化后的数据,JSON是中间一种象征方法。

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

1.2 首个参数可以是函数,也足以是一个数组

  • 要是第一个参数是一个函数,那么体系化进度中的每个属性都会被那几个函数转化和处理

  • 假使第一个参数是一个数组,那么只有隐含在那些数组中的属性才会被体系化到终极的JSON字符串中

  • 一经第一个参数是null,那功用上和空着没啥分歧,但是不想设置首个参数,只是想设置第多个参数的时候,就可以安装首个参数为null

那第一个参数要是函数

var friend={
    "firstName": "Good",
    "lastName": "Man",
    "phone":"1234567",
    "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","age":28}

假若制定了第四个参数是函数,那么这么些函数必须对每一项都有重返,那几个函数接受多少个参数,一个键名,一个是属性值,函数必须针对每一个原先的属性值都要有新属性值的回来。

那么难题来了,如若传入的不是键值对的对象方式,而是方括号的数组格局吗?,比如上边的friend成为那样:friend=["Jack","Rose"],那么那一个逐属性处理的函数接收到的key和value又是什么样?倘诺是数组方式,那么key是索引,而value是那个数组项,你可以在控制台在那些函数内部打印出来那些key和value验证,记得要赶回value,不然会出错。

那第一个参数如果数组

var friend={
    "firstName": "Good",
    "lastName": "Man",
    "phone":"1234567",
    "age":18
};

//注意下面的数组有一个值并不是上面对象的任何一个属性名
var friendAfter=JSON.stringify(friend,["firstName","address","phone"]);

console.log(friendAfter);
//{"firstName":"Good","phone":"1234567"}
//指定的“address”由于没有在原来的对象中找到而被忽略

设若第四个参数是一个数组,那么唯有在数组中冒出的属性才会被种类化进结果字符串,只要在这些提供的数组中找不到的性质就不会被含有进去,而那么些数组中存在可是源JS对象中不设有的特性会被忽视,不会报错。

2.基于文本的数据格式

    相关示例:

1.3 第多个参数用于美化输出 —— 不提出用

点名缩进用的空白字符,可以取以下多少个值:

  • 是1-10的某部数字,代表用多少个空白字符

  • 是字符串的话,就用该字符串代替空格,最多取这么些字符串的前10个字符

  • 从未提供该参数 等于 设置成null 等于 设置一个低于1的数

    var friend={

    "firstName": "Good",
    "lastName": "Man",
    "phone":{"home":"1234567","work":"7654321"}
    

    };

    //直接转接是如此的:
    //{“firstName”:”Good”,”lastName”:”Man”,”phone”:{“home”:”1234567″,”work”:”7654321″}}

    var friendAfter=JSON.stringify(friend,null,4);
    console.log(friendAfter);
    /*
    {

    "firstName": "Good",
    "lastName": "Man",
    "phone": {
        "home": "1234567",
        "work": "7654321"
    }
    

    }
    */

    var friendAfter=JSON.stringify(friend,null,”HAHAHAHA”);
    console.log(friendAfter);
    /
    {
    HAHAHAHA”firstName”: “Good”,
    HAHAHAHA”lastName”: “Man”,
    HAHAHAHA”phone”: {
    HAHAHAHAHAHAHAHA”home”: “1234567”,
    HAHAHAHAHAHAHAHA”work”: “7654321”
    HAHAHAHA}
    }
    /

    var friendAfter=JSON.stringify(friend,null,”WhatAreYouDoingNow”);
    console.log(friendAfter);
    / 最八只取10个字符
    {
    WhatAreYou”firstName”: “Good”,
    WhatAreYou”lastName”: “Man”,
    WhatAreYou”phone”: {
    WhatAreYouWhatAreYou”home”: “1234567”,
    WhatAreYouWhatAreYou”work”: “7654321”
    WhatAreYou}
    }
    /

 

笑笑就好,别那样用,系列化是为了传输,传输就是能越小越好,加不可捉摸的缩进符,解析困难(要是是字符串的话),也削弱了轻量化那几个特性。。

JSON是按照文本的数码格式,相对于根据二进制的数额,所以JSON在传递的时候是传递符合JSON那种格式(至于JSON的格式是何许大家第二局地加以)的字符串,大家常会称呼“JSON字符串”。

    <!DOCTYPE
html>

1.4 注意那些函数的“小智慧”(紧要)

如若有别的不确定的意况,那么最好的法子就是”Have a
try”,控制台做下实验就明了。

  • 键名不是双引号的(包括没有引号或者是单引号),会活动成为双引号;字符串是单引号的,会自行变成双引号

  • 最终一个性质后面有逗号的,会被电动去掉

  • 非数组对象的习性不可以保障以一定的次第出现在序列化后的字符串中 那些好通晓,也就是对非数组对象在终极字符串中不保障属性顺序和原先一样

  • 布尔值、数字、字符串的包装对象在连串化进度中会自动转换成对应的原始值 
    也就是你的哪些new String("bala")会变成"bala"new Number(2017)会变成2017

  • undefined、任意的函数(其实有个函数会发生神奇的事,后边会说)以及
    symbol 值(symbol详见ES6对symbol的牵线)

    • 出现在非数组对象的属性值中:在系列化进度中会被忽略

    • 并发在数组中时:被转换成 null

    JSON.stringify({x: undefined, y: function(){return 1;}, z: Symbol(“”)});
    //出现在非数组对象的属性值中被忽略:”{}”
    JSON.stringify([undefined, Object, Symbol(“”)]);
    //出现在数组对象的属性值中,变成null:”[null,null,null]”

  • NaN、Infinity和-Infinity,不论在数组或者非数组的靶子中,都被转载为null

  • 抱有以 symbol 为属性键的性质都会被完全忽略掉,尽管 replacer
    参数中强制指定包括了它们

  • 不可胜道的属性会被忽略

3.轻量级的数码格式

    <html>

2. 将JSON字符串解析为JS数据结构 —— JSON.parse

那一个函数的函数签名是这么的:

JSON.parse(text[, reviver])

倘使第三个参数,即JSON字符串不是合法的字符串的话,那么那么些函数会抛出荒唐,所以只要您在写一个后端再次回到JSON字符串的剧本,最好调用语言本身的JSON字符串相关系列化函数,而一旦是投机去拼接完成的种类化字符串,那么就进一步要注意连串化后的字符串是不是是合法的,合法指这些JSON字符串完全符合JSON需要的严厉格式。

值得注意的是此处有一个可选的第四个参数,那些参数必须是一个函数,那一个函数成效在质量已经被分析只是还没赶回前,将品质处理后再回来。

var friend={
    "firstName": "Good",
    "lastName": "Man",
    "phone":{"home":"1234567","work":["7654321","999000"]}
};

//我们先将其序列化
var friendAfter=JSON.stringify(friend);
//'{"firstName":"Good","lastName":"Man","phone":{"home":"1234567","work":["7654321","999000"]}}'

//再将其解析出来,在第二个参数的函数中打印出key和value
JSON.parse(friendAfter,function(k,v){
    console.log(k);
    console.log(v);
    console.log("----");
});
/*
firstName
Good
----
lastName
Man
----
home
1234567
----
0
7654321
----
1
999000
----
work
[]
----
phone
Object
----

Object
----
*/

周到看一下这一个输出,可以发现这些遍历是由内而外的,可能由内而外这一个词大家会误解,最里层是内部数组里的七个值啊,不过出口是从第四个特性开头的,怎么就是由内而外的呢?

本条由内而外指的是对于复合属性来说的,通俗地讲,遍历的时候,从头到尾举行遍历,要是是粗略属性值(数值、字符串、布尔值和null),那么直接遍历落成,如若是遇上属性值是目的或者数组格局的,那么暂停,先遍历这几个子JSON,而遍历的规格也是一致的,等那么些复合属性遍历完结,那么再形成对这么些特性的遍历重返。

实质上,那就是一个纵深优先的遍历。

有两点要求留意:

  • 一旦 reviver 再次回到undefined,则当前属性会从所属对象中去除,假设回去了其余值,则赶回的值会成为当前品质新的属性值。

  • 您可以小心到地方例子最终一组输出看上去没有key,其实这些key是一个空字符串,而最终的object是终极解析已毕目的,因为到了最上层,已经远非当真的特性了。

在JSON此前,有一个数目格式叫xml,现在依旧周边在用,不过JSON越发轻量,如xml必要运用很多标签。

      <head>

3. 震慑 JSON.stringify 的神奇函数 —— object.toJSON

即使您在一个JS对象上落到实处了toJSON措施,那么调用JSON.stringify去连串化这么些JS对象时,JSON.stringify会把那一个目的的toJSON措施再次来到的值作为参数去开展系列化。

var info={
    "msg":"I Love You",
    "toJSON":function(){
        var replaceMsg=new Object();
        replaceMsg["msg"]="Go Die";
        return replaceMsg;
    }
};

JSON.stringify(info);
//出si了,返回的是:'"{"msg":"Go Die"}"',说好的忽略函数呢

本条函数就是这样子的。

其实Date品类可以平素传给JSON.stringify做参数,其中的道理就是,Date品种内置了toJSON方法。

像上面的例证中,你可以明确看到xml格式的数码中标签我占据了不少空间,而JSON比较轻量,即一律数量,以JSON的格式占据的带宽更小,那在有大气数目请求和传递的景况下是有可想而知优势的。

        <meta charset=”utf-8″>
        <title>菜鸟教程(runoob.com)</title>
      </head>
    <body>

四、小结以及关于包容性的难题

到此处终于把,JSON和JS中的JSON,梳理了一次,也对中间的底细和留心点开展了五次遍历,知道JSON是一种语法上衍生于JS语言的一种轻量级的数据沟通格式,也知道了JSON相对于一般的JS数据结构(越发是目的)的异样,更进一步,仔细地切磋了JS中有关JSON处理的3个函数和细节。

可是遗憾的是,以上所用的3个函数,不包容IE7以及IE7以前的浏览器。有关包容性的啄磨,留待未来吧。若是想直接在使用上缓解兼容性,那么可以套用JSON官方的js,可以解决。

如有纰漏,欢迎留言提议。

 

via:

 

4.被周边地用来数据交流

      <h2>从 JSON 字符串中开创一个对象</h2>
      <p id=”demo”></p>
    <script>
      var text = ‘{“employees”:[‘ +
      '{“name”:”菜鸟教程”,”site”:”” },’ +
      '{“name”:”Google”,”site”:”” },’ +
      '{“name”:”Taobao”,”site”:”” }]}’;
      obj = JSON.parse(text);
      document.getElementById(“demo”).innerHTML =
      obj.employees[1].name + ” ” + obj.employees[1].site;
    </script>

轻量已经是一个用以数据沟通的优势了,但更要紧的JSON是便于阅读、编写和机械解析的,即那么些JSON对人和机具都是友好的,而且又轻,独立于言语(因为是根据文本的),所以JSON被广大用于数据调换。

   </body>
  </html>

原先端JS举行ajax的POST请求为例,后端PHP处理请求为例:

  选参:

1).前端构造一个JS对象,用于包装要传递的多少,然后将JS对象转化为JSON字符串,再发送请求到后端;

    <!DOCTYPE html>

2).后端PHP接收到这些JSON字符串,将JSON字符串转化为PHP对象,然后处理请求。

    <html>
    <head>
      <meta charset=”utf-8″>
      <title>菜鸟教程(runoob.com)</title>
    </head>
    <body>

前端构造一个JS对象,用于包装要传送的多少,然后将JS对象转化为JSON字符串,再发送请求到后端;

      <h2>使用可选参数,回调函数</h2>
      <p id=”demo”></p>
      <script>
        JSON.parse(‘{“p”: 5}’, function(k, v) {
        if (k === ”) { return v; }
        return v * 2;
        });
        JSON.parse(‘{“1”: 1, “2”: 2, “3”: {“4”: 4, “5”: {“6”:
6}}}’, function(k, v) {
        document.write( k );// 输出当前品质,最后一个为 “”
        document.write(“<br>”);
        return v; // 重返修改的值
        });
      </script>

后端PHP接收到这一个JSON字符串,将JSON字符串转化为PHP对象,然后处理请求。

    </body>
   </html>

可以观望,相同的数码在那边有3种不一致的表现形式,分别是前者的JS对象、传输的JSON字符串、后端的PHP对象。

   JSON.stringify艺术用于将一个值转为字符串。该字符串应该符合JSON格式,并且可以被JSON.parse办法还原。

JS对象和PHP对象显明不是一个事物,可是出于大家用的都是JSON来传递数据,我们都能明白那种数量格式,都能把JSON那种多少格式很不难地转向为自己能掌握的数据结构。

   语法:JSON.stringify(value[, replacer[, space]]) 

那就便于啦,在此外种种语言环境中互换数据都是如此。

    参数表明:

JSON 和 JS 对象之间的“八卦”

    • value:

      必备, 一个实用的 JSON 字符串。

    • replacer:

      可选。用于须要转成字符串的特性。。

      万一 replacer 为函数,则 JSON.stringify
      将调用该函数,并传播每个成员的键和值。使用重回值而不是原始值。要是此函数再次回到undefined,则排除成员。根对象的键是一个空字符串:””。

      如若 replacer
      是一个数组,则仅转换该数组中颇具键值的分子。成员的变换顺序与键在数组中的顺序一样。当
      value 参数也为数组时,将忽略 replacer 数组。

    • space:

      可选,文本添加缩进、空格和换行符,用于追加重临的JSON字符串的可读性。即便是数字,表示每个属性前边添加的空格(最多不当先10个);假如是字符串(不超过10个字符),则该字符串会添加在每行后边。

不少时候都听见“JSON是JS的一个子集”这句话,而且这句话我一度也从来如此觉得,每个符合JSON格式的字符串你分析成js都是足以的,直到后来意识了一个奇奇怪怪的东西…

   相关代码示例:

1.三个精神区其余事物怎么那么精心

    <!DOCTYPE html>

JSON和JS对象本质上完全不是同一个事物,就像是“斑马线”和“斑马”,“斑马线”基于“斑马”身上的条纹来表现和命名,可是斑马是活的,斑马线是非生物。

    <html>
      <head>
        <meta charset=”utf-8″>
        <title>菜鸟教程(runoob.com)</title>
      </head>
      <body>

如出一辙,”JSON”全名”JavaScript Object
Notation”,所以它的格式(语法)是按照JS的,但它就是一种格式,而JS对象是一个实例,是存在于内存的一个东西。

        <p id=”demo”></p>
        <script>
          var str = {“name”:”菜鸟教程”,
“site”:”
          str_pretty1 = JSON.stringify(str)
          document.write( “唯有一个参数情形:” );
          document.write( “<br>” );
          document.write(“<pre>” + str_pretty1 +
“</pre>” );
          document.write( “<br>” );
          str_pretty2 = JSON.stringify(str, null, 4)
//使用八个空格缩进
          document.write( “使用参数意况:” );
          document.write( “<br>” );
          document.write(“<pre>” + str_pretty2 +
“</pre>” ); // pre 用于格式化输出
        </script>

说句玩笑话,如若JSON是按照PHP的,可能就叫PON了,格局可能就是那般的了[‘propertyOne’
=> ‘foo’, ‘propertyTwo’ =>
42,],若是这么,那么JSON可能现在是和PHP相比较密切了。

      </body>
    </html>

除此以外,JSON是足以传输的,因为它是文本格式,可是JS对象是无法传输的,在语法上,JSON也会越加严俊,可是JS对象就很松了。

    由 JSON.stringify 方法用于允许转换某个对象的多少以举办JavaScript Object Notation (JSON) 种类化。

那么三个不一样的东西怎么那么细心,因为JSON毕竟是从JS中衍生和变化出来的,语法相近。

    语法:objectname.toJSON()

2.JSON 格式比 JS 对象语法严刻的显现

    参数:objectname需求。  必要进行JSON 种类化的对象。  

先就以“键值对为表现的目的”方式上,相比较下两岸的不比,至于JSON仍能以什么样的款式突显,相比较完后再罗列。

    代码示例:

亚洲必赢官网 3

    使用 toJSON 方法将大写的字符串成员值序列化。  在调用 JSON.stringify 时调用 toJSON 方法。  

可以看看,相对于JS对象,JSON的格式更严厉,所以大多数写的JS对象是不相符JSON的格式的。

    var contact = new Object();

亚洲必赢官网 4

     contact.firstname = “Jesper”;

3.JSON 不是 JS 的子集

     contact.surname = “Aaberg”;

第一看上面的代码,你可以copy到控制台执行下:

     **contact.phone = [“555-0100”, “555-0120”];**

亚洲必赢官网 5

     ***contact.toJSON =
function(key*    ***       var replacement = new
Object();***

这多少个字符\u2028和\u2029分别表示行分隔符和段落分隔符,JSON.parse可以健康解析,可是作为js解析时会报错。

       for (var val in this)
      {
          if (typeof (this[val]) === 'string')
              replacement[val] = this[val].toUpperCase();
          else
              replacement[val] = this[val]
      }
      return replacement;
  };

  var jsonText = JSON.stringify(contact);

  /* The value of jsonText is:
  '{"firstname":"JESPER","surname":"AABERG","phone":["555-0100","555-0120"]}'
  */
  以下示例演示如何使用作为 Date 对象的内置成员的 toJSON 方法。 

  var dt = new Date('8/24/2009');
  dt.setUTCHours(7, 30, 0);
  var jsonText = JSON.stringify(dt);

  /* The value of jsonText is:
  '"2009-08-24T07:30:00Z"'
  */

 

 

这几个 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 字符串

将JS数据结构转化为JSON字符串 —— JSON.stringify

其一函数的函数签名是这么的:

亚洲必赢官网 6

下边将独家进行带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

那第三个参数借使函数

亚洲必赢官网 7

若果制定了第四个参数是函数,那么那么些函数必须对每一项都有再次回到,这一个函数接受八个参数,一个键名,一个是属性值,函数必须针对每一个原本的属性值都要有新属性值的回来。

那么难点来了,若是传入的不是键值对的靶子方式,而是方括号的数组方式吗?,比如上边的friend变成那样:friend=[“Jack”,”Rose”],那么这几个逐属性处理的函数接收到的key和value又是何许?

一经是数组情势,那么key是索引值,而value是以此数组项,你可以在控制台在那几个函数内部打印出来那几个key和value验证,记得要在函数内部重返value,不然会出错。

那第三个参数倘使数组

亚洲必赢官网 8

假定首个参数是一个数组,那么唯有在数组中出现的特性才会被连串化进结果字符串,只要在那一个提供的数组中找不到的质量就不会被含有进去,而以此数组中存在但是源JS对象中不存在的习性会被忽视,不会报错。

1.3 第多个参数用于美化输出 —— 不提出用

点名缩进用的空白字符,能够取以下多少个值:

  • 是1-10的某个数字,代表用多少个空白字符
  • 是字符串的话,就用该字符串代替空格,最多取这些字符串的前10个字符
  • 不曾提供该参数 等于 设置成null 等于 设置一个稍差于1的数

亚洲必赢官网 9

亚洲必赢官网 10

笑笑就好,别那样用,连串化是为了传输,传输就是能越小越好,加莫明其妙的缩进符,解析困难(若是是字符串的话),也削弱了轻量化这么些特性。。

1.4 注意那一个函数的“小智慧”(首要)

假使有其余不确定的图景,那么最好的法门就是”Have a
try”,控制台做下实验就明了。

  • 键名不是双引号的(包含没有引号或者是单引号),会自动变成双引号;字符串是单引号的,会活动变成双引号
  • 末尾一个属性后边有逗号的,会被机关去掉
  • 非数组对象的品质否够确保以一定的次第出现在种类化后的字符串中
  • 本条好领会,也就是对非数组对象在结尾字符串中不保险属性顺序和原先一样
  • 布尔值、数字、字符串的卷入对象在体系化进度中会自动转换成对应的原始值
  • 也就是您的什么样new String(“bala”)会成为”bala”,new
    Number(2017)会成为2017
  • undefined、任意的函数(其实有个函数会时有暴发神奇的事,前边会说)以及
    symbol 值(symbol详见ES6对symbol的牵线)
    • 并发在非数组对象的属性值中:在种类化进程中会被忽视
    • 并发在数组中时:被转换成 null

亚洲必赢官网 11

  • NaN、Infinity和-Infinity,不论在数组或者非数组的目的中,都被转化为null
  • 怀有以 symbol 为属性键的特性都会被全然忽视掉,尽管 replacer
    参数中胁制指定包括了它们
  • 不足为奇的性质会被忽略

2.JSON 字符串解析为 JS 数据结构

将JSON字符串解析为JS数据结构 —— JSON.parse

这么些函数的函数签名是这么的:

亚洲必赢官网 12

假若第四个参数,即JSON字符串不是法定的字符串的话,那么那一个函数会抛出荒谬,所以即使您在写一个后端重临JSON字符串的脚本,最好调用语言本身的JSON字符串相关种类化函数。

而一旦是和谐去拼接完结的连串化字符串,那么就越是要留意体系化后的字符串是不是是合法的,合法指这些JSON字符串完全符合JSON必要的严俊格式。

值得注意的是那里有一个可选的第三个参数,那些参数必须是一个函数,那一个函数功效在性质已经被分析只是还没回去前,将品质处理后再回到。

亚洲必赢官网 13

亚洲必赢官网 14

有心人看一下那一个输出,可以发现这几个遍历是由内而外的,可能由内而外那几个词大家会误解,最里层是中间数组里的七个值啊,可是出口是从首个特性开端的,怎么就是由内而外的啊?

本条由内而外指的是对此复合属性来说的,通俗地讲,遍历的时候,从头到尾进行遍历,假使是概括属性值(数值、字符串、布尔值和null),那么直接遍历已毕。

借使是遇上属性值是目标或者数组方式的,那么暂停,先遍历那么些子JSON,而遍历的规范也是一律的,等这么些复合属性遍历完毕,那么再形成对那么些特性的遍历再次回到。

实为上,那就是一个深度优先的遍历。

有两点必要小心:

  • 只要 reviver 再次来到undefined,则当前属性会从所属对象中剔除,如果回到了其它值,则赶回的值会成为当下质量新的属性值。
  • 您可以小心到地点例子最终一组输出看上去没有key,其实这一个key是一个空字符串,而最后的object是终极解析完结目标,因为到了最上层,已经没有当真的性质了。

3.震慑 JSON.stringify 的神奇函数

影响 JSON.stringify 的神奇函数 —— object.toJSON

要是你在一个JS对象上完结了toJSON方法,那么调用JSON.stringify去系列化那几个JS对象时,JSON.stringify会把这几个目标的toJSON方法重回的值作为参数去开展体系化。

亚洲必赢官网 15

其一函数就是那样子的。

事实上Date类型可以直接传给JSON.stringify做参数,其中的道理就是,Date类型内置了toJSON方法。

小结以及有关包容性的标题

到此处终于把,JSON和JS中的JSON,梳理了一回,也对中间的底细和留心点开展了四回遍历,知道JSON是一种语法上衍生于JS语言的一种轻量级的数据沟通格式,也清楚了JSON绝对于一般的JS数据结构(尤其是目标)的歧异,更进一步,仔细地啄磨了JS中关于JSON处理的3个函数和细节。

只是遗憾的是,以上所用的3个函数,不包容IE7以及IE7往日的浏览器。有关包容性的钻探,留待未来吧。即使想直接在动用上缓解包容性,那么能够套用JSON官方的js,可以解决。

 

 

 

 

 

 

 

 

 

 

 

网站地图xml地图