JSON格式

一、定义

全称 JavaScript Object Notation,是一种用于数据交换的文本格式,2001年由 Douglas Crockford 提出,目的是取代繁琐笨重的 XML 格式。

二、使用规则

(1) 复合类型的值只能是数组或对象,不能是函数、正则表达式对象、日期对象

(2) 简单类型的值只有四种字符串、数值(必须以十进制表示)、布尔值和null(不能使用NaN, Infinity, -Infinity和undefined)。

(3) 字符串必须使用双引号表示,不能使用单引号

(4) 对象的键名必须放在双引号里面。

(5) 数组或对象最后一个成员的后面,不能加逗号

比如说:合格的JSON 格式

["one", "two", "three"]

{ "one": 1, "two": 2, "three": 3 }

{"names": ["张三", "李四"] }

[ { "name": "张三"}, {"name": "李四"} ]

如果这样子,是不合格的啦

{ name: "张三", 'age': 32 }  // 属性名必须使用双引号

[32, 64, 128, 0xFFF] // 不能使用十六进制值

{ "name": "张三", "age": undefined } // 不能使用undefined

{ "name": "张三",
  "birthday": new Date('Fri, 26 Aug 2011 07:13:10 GMT'),
  "getName": function() {
      return this.name;
  }
} // 不能使用函数和日期对象

三、处理JSON格式数据方法

A、JSON.stringify()

将一个值(对象或数组)转为JSON字符串。该字符串符合 JSON 格式,并且可以被JSON.parse方法还原

语法

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

参数

(1) value: 将要序列化成 一个JSON 字符串的值

(2) replacer (可选)

  • 如果该参数是一个函数,则在序列化过程中,被序列化的值的每个属性都会经过该函数的转换和处理

    function replacer(key, value) {
      if (typeof value === "string") {
        return undefined;
      }
      return value;
    }
    
    var foo = {foundation: "Mozilla", model: "box", week: 45, transport: "car", month: 7};
    var jsonString = JSON.stringify(foo, replacer);
    //JSON序列化结果为 {"week":45,"month":7}
    
  • 如果该参数是一个数组,则只有包含在这个数组中的属性名才会被序列化到最终的 JSON 字符串中

    JSON.stringify(foo, ['week', 'month']);  
    // '{"week":45,"month":7}', 只保留“week”和“month”属性值
    
  • 如果该参数为null或者未提供,则对象所有的属性都会被序列化

(3) space (可选)

指定缩进用的空白字符串,用于美化输出(pretty-print)

  • 如果参数是个数字,它代表有多少的空格;上限为10。该值若小于1,则意味着没有空格

    image.png
  • 如果该参数为字符串(字符串的前十个字母),该字符串将被作为空格

    image.png
  • 如果该参数没有提供(或者为null)将没有空格

    image.png

返回值: 一个表示给定值的JSON字符串。

转换 JSON 字符串

JSON.stringify('abc') // ""abc""
JSON.stringify(1) // "1"
JSON.stringify(false) // "false"
JSON.stringify([]) // "[]"
JSON.stringify({}) // "{}"

JSON.stringify([1, "false", false])
// '[1,"false",false]'

JSON.stringify({ name: "张三" })
// '{"name":"张三"}'

特别注意啦 对于原始类型的字符串,转换结果会带双引号

JSON.stringify('foo') === "foo" // false
JSON.stringify('foo') === "\"foo\"" // true

分析:字符串'foo',被转成了""foo""。这是因为将来还原的时候,双引号可以让 JavaScript 引擎知道 。foo是一个字符串,而不是一个变量名

如果原始对象中,有一个成员的值undefined、函数XML 对象,这个成员会被过滤

var obj = {
  a: undefined,
  b: function () {}
};

JSON.stringify(obj) // "{}"

分析:对象obj的a属性是undefined,而b属性是一个函数,结果都被JSON.stringify过滤。

如果数组的成员是undefined、函数XML 对象,则这些值被转成null。

var arr = [undefined, function () {}];
JSON.stringify(arr) // "[null,null]"

分析:数组arr的成员是undefined和函数,它们都被转成了null。

正则对象会被转成空对象

JSON.stringify(/foo/) // "{}"

JSON.stringify方法会忽略对象的不可遍历属性

B、JSON.parse()

用于将JSON字符串转化成对象

JSON.parse('{}') // {}
JSON.parse('true') // true
JSON.parse('"foo"') // "foo"
JSON.parse('[1, 5, "false"]') // [1, 5, "false"]
JSON.parse('null') // null

var o = JSON.parse('{"name": "张三"}');
o.name // 张三

如果传入的字符串不是有效的JSON格式 ,JSON.parse方法将报错。

JSON.parse("'String'") // illegal single quotes
// SyntaxError: Unexpected token ILLEGAL

分析:双引号字符串中是一个单引号字符串,因为单引号字符串不符合JSON格式,所以报错。

四、JavaScript 对象和 JSON 的关系

(1) JavaScript 对象的字面量写法只是长的像 JSON 格式数据,二者属于不同的范畴

(2) JavaScript 对象中很多类型(函数、正则、Date) ,JSON 格式的规范并不支持

(3) JavaScript 对象的字面量写法更宽松。

五、深拷贝例子

var obj = {
    name: 'hunger',
    age: 3,
    friends: ['aa', 'bb', 'cc']
}

var obj2 = JSON.parse(JSON.stringify(obj))
obj.age = 4
console.log(obj2.age)

参考

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/JSON/stringify

http://javascript.ruanyifeng.com/stdlib/json.html

https://blog.jirengu.com/?p=378

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 206,126评论 6 481
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 88,254评论 2 382
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 152,445评论 0 341
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 55,185评论 1 278
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 64,178评论 5 371
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,970评论 1 284
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,276评论 3 399
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,927评论 0 259
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 43,400评论 1 300
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,883评论 2 323
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,997评论 1 333
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,646评论 4 322
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,213评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,204评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,423评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 45,423评论 2 352
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,722评论 2 345

推荐阅读更多精彩内容

  • 道声早安,我的三个标签是第一个标签是两个孩子的妈妈,第二个标签呢是时间管理,建行第三个标签呢,是摄影爱好者和晨跑爱...
    Aimee1314阅读 301评论 0 0
  • 概要 64学时 3.5学分 章节安排 电子商务网站概况 HTML5+CSS3 JavaScript Node 电子...
    阿啊阿吖丁阅读 9,095评论 0 3
  • 【回顾目标】 分析销售业绩情况 提取有效信息,反应业绩成果 【评估结果】 更直观的反映销售各项指标情况 将多个项目...
    红_b1d3阅读 310评论 0 0
  • 用def定义函数 1.python的函数返回多值其实是返回一个tuple2.位置参数:power(x,n)中的x和...
    想吃鸡排饭阅读 241评论 0 0
  • 你相信命运吗?在遭受挫折时,你是怎么走出来的?有人常说挫折是上天送给你的礼物,只是包装比较简陋。挫折使人成长...
    fedad2e5cd07阅读 152评论 0 0