JSON初相识

92 阅读4分钟

JSON是什么

定义:

JSON(JavaScript Object Notation, JS 对象简谱) 是一种轻量级的数据交换格式。它基于 ECMAScript (欧洲计算机协会制定的js规范)的一个子集,采用完全独立于编程语言的文本格式来存储和表示数据。简洁和清晰的层次结构使得 JSON 成为理想的数据交换语言。 易于人阅读和编写,同时也易于机器解析和生成,并有效地提升网络传输效率

JSON与JS对象的关系

JSON 是 JS 对象的字符串表示法,它使用文本表示一个 JS 对象的信息,本质是一个字符串

  var obj = {a: 'Hello', b: 'World'}; //这是一个对象,注意键名也是可以使用引号包裹的
  var json = '{"a": "Hello", "b": "World"}'; //这是一个 JSON 字符串,本质是一个字符串

JSON和JS对象互转

要实现从JSON字符串转换为JS对象,使用 JSON.parse() 方法:

 
  var obj = JSON.parse('{"a": "Hello", "b": "World"}'); //结果是 {a: 'Hello', b: 'World'}

要实现从JS对象转换为JSON字符串,使用 JSON.stringify() 方法:

  var json = JSON.stringify({a: 'Hello', b: 'World'}); //结果是 '{"a": "Hello", "b": "World"}'

JSON与XML的对比

  • 可读性:JSON和XML的可读性可谓不相上下,一边是简易的语法,一边是规范的标签形式,很难分出胜负。

  • 可扩展性:XML天生有很好的扩展性,JSON当然也有,没有什么是XML可以扩展而JSON却不能扩展的。不过JSON在Javascript主场作战,可以存储Javascript复合对象,有着xml不可比拟的优势。

  • 编码难度:XML有丰富的编码工具比如Dom4j、Dom、SAX等,JSON也有提供的工具。无工具的情况下,相信熟练的开发人员一样能很快的写出想要的xml文档和JSON字符串,不过,xml文档要多很多结构上的字符。

  • 解码难度:

    • XML解析方式有两种,JSON也一样(吧)

      • 通过文档模型解析,也就是通过父标签索引出一组标记。
      • 表遍历节点,可以通过递归来实现,不过解析出来的数据形态各异,往往不能满足预先的需求。
  • 有效数据率。JSON作为数据包格式传输时更高效,因为JSON不像XML那样需要严格的闭合标签,会让有效数据量与总数据包比大大提升,从而减少同等数据流量的情况和网络传输压力。

XML和JSON都使用结构化方法来标记数据,下面来做一个简单的比较。

用XML表示中国部分省市数据如下:

  <?xml version="1.0" encoding="utf-8"?>
  <country>
      <name>中国</name>
      <province>
          <name>黑龙江</name>
          <cities>
              <city>哈尔滨</city>
              <city>大庆</city>
          </cities>
      </province>
      <province>
          <name>广东</name>
          <cities>
              <city>广州</city>
              <city>深圳</city>
              <city>珠海</city>
          </cities>
      </province>
      <province>
          <name>台湾</name>
          <cities>
              <city>台北</city>
              <city>高雄</city>
          </cities>
      </province>
      <province>
          <name>新疆</name>
          <cities>
              <city>乌鲁木齐</city>
          </cities>
      </province>
  </country>

用JSON表示如下:

  {
      "name": "中国",
      "province": [{
          "name": "黑龙江",
          "cities": {
              "city": ["哈尔滨", "大庆"]
          }
      }, {
          "name": "广东",
          "cities": {
              "city": ["广州", "深圳", "珠海"]
          }
      }, {
          "name": "台湾",
          "cities": {
              "city": ["台北", "高雄"]
          }
      }, {
          "name": "新疆",
          "cities": {
              "city": ["乌鲁木齐"]
          }
      }]
  }

可以看到,JSON 简单的语法格式和清晰的层次结构明显要比 XML 容易阅读,并且在数据交换方面,由于 JSON 所使用的字符要比 XML 少得多,可以大大得节约传输数据所占用的带宽。(虽然习惯了看xml的我觉得xml更容易读哈)

JSON格式取代了xml给网络传输带来了很大的便利,但是却没有了xml的一目了然,尤其是json数据很长的时候,我们会陷入繁琐复杂的数据节点查找中(确实确实)

JSON语法

JSON语法是Javascript语法的子集

语法规则:

  • 数据在名称/值对中
  • 数据由逗号分隔
  • 大括号 {} 保存对象
  • 中括号 [] 保存数组,数组可以包含多个对象

JSON值

  • 数字(整数或浮点数)

    •   {"age":30}
      
  • 字符串(在双引号中)

  • 逻辑值(true 或 false)

    •   {"flag":true}
      
  • 数组(在中括号中)

    •   [
          "sites":[{"name":"xiaoming","url":"www.baidu.com"},  {"name":"xiao","url":"www.google.com"}
        ]
        ]
      
    • 在上面的例子中,对象 sites 是包含两个对象的数组。每个对象代表一条关于某个网站(name、url)的记录
  • 对象(在大括号中)

    •   {"name":"xiaoming","url":"www.baidu.com"}//等价于js中的👇
      
    •   name = "xiaoming"
        url = "www.baidu.com"
      
  • null

    •   {"runoob":null}