json学习大全

1.json简介

1.1 定义

• 定义： json是轻量级的文本数据交换格式。javascript对象表示法。(javascript Object Notation)

1.2 用于做什么

• 作用：
  1. json用于存储和交换文本信息的语法。类似XML。
  2. json常用于服务端向网页传送数据。

1.3 特点

• 特点：
  1. json是独立语言。使用javascript语法来描述数据对象，但是json仍然独立于语言和平台。 json解析器和json库支持不同的语言。
  2. json比xml更小，更快，更易解析。

1.3 与xml比较

• 相同点：
  1. json是纯文本
  2. json具有自我描述性(人类可读)
  3. json具有层级结构(值中存在值)
  4. json可通过javascript解析
  5. json数据可使用ajax进行传输
• 不同点：
  1. json没有结束标签
  2. json更短
  3. json读写速度块
  4. 能够使用内建的javascript eval()方法进行解析
  5. 使用数组
  6. 不使用保留字

2. json语法

2.1 语法规则

1. 数据在名称/值对中；
2. 数据由逗号分割；
3. 花括号保存对象；
4. 方括号保存数组；

• json名称/值对

json数据的书写格式：名称/值对
        名称/值对：字段名称(在双引号中)，后面写一个冒号，然后是值。
        例如："firstname"："John"

• json值：

		数字(整数，浮点数)
        字符串(在双引号中)
        逻辑值(true,false)
        数组(在方括号中)
        对象(在花括号中)
        null

• json对象

对象可以包含多个名称/值对：
        例如：{
            "name":"maolili",
             "age":21
        }

• json数组

 "arrs":[
            {"name":"maolili","age":21},
            {"name":"maolili","age":21},
          ]

2.2 json使用javascript语法

    
    



    
通过 JSON 字符串来创建对象
    
json使用javascript语法，所以不需要额外的软件就能处理javascript中的json
    
First Name: 

    

3. json的使用

3.1 把json文本转换成javascript对象

• json最常见的方法之一，是从web服务器上读取json数据(作为文件或作为httpRequest)，将json数据转换成javascript对象，然后在网页中使用该数据。

• eval()： 由于json语法是javascript语法的子集，javascript函数eval()可用于将json文本转换成javascript对象。eval()函数使用的是javascript编译器，可解析json文本，然后生成javascript对象。必须把文本包围在括号中，这样避免语法错误。var obj = eval ("(" + txt + ")");

• 实例：

    
    



通过 JSON 字符串来创建对象

    因为json语法是javascript语法的子集，javascript函数eval()可用于将json文本转换成javascript对象
    eval()函数使用的是javascript编译器，可以解析json文本，然后生成javascript对象。
    但是必须把文本写在括号中，这样才可以避免错误。

    

        First Name: 

        Last Name: 

    
    

3.2 json解析器

• eval() 函数可编译并执行任何 JavaScript 代码。这隐藏了一个潜在的安全问题。

• 使用json解析器将json转换成javascript对象更安全。json解析器只能识别到json文本，而不会编译脚本。

• 在浏览器中，提供原生的json支持，而且json解析速度快。

• 实例：

    
    



用 JSON 字符串创建对象

3.3 使用ajax获取json文件中数据

• 1.json

[

  {

    "name":"张国立",

    "sex":"男",

    "email":"[email protected]",

    "url":"1.jpg"

  },

  {

    "name":"张铁林",

    "sex":"男",

    "email":"[email protected]",

    "url":"2.jpg"

  },

  {

    "name":"邓婕",

    "sex":"女",

    "email":"[email protected]",

    "url":"3.jpg"

  },

  {

    "name":"张国立",

    "sex":"男",

    "email":"[email protected]",

    "url":"4.jpg"

  },

  {

    "name":"张铁林",

    "sex":"男",

    "email":"[email protected]",

    "url":"5.jpg"

  },

  {

    "name":"邓婕",

    "sex":"女",

    "email":"[email protected]",

    "url":"6.jpg"

  }

]

• 效果