JSON 教程

1JSON

1、什么是 JSON ？

      1.1JSON：JavaScript 对象表示法（JavaScript Object Notation）。

      1.2JSON 是存储和交换文本信息的语法。类似 XML。

      1.3JSON 比 XML 更小、更快，更易解析。



2、JSON - 转换为 JavaScript 对象

     2.1JSON 文本格式在语法上与创建 JavaScript 对象的代码相同。



2简介



1、类似 XML

          1.1 JSON 是纯文本

1.2JSON 具有“自我描述性”（人类可读）

1.3JSON 具有层级结构（值中存在值）

1.4JSON 可通过 JavaScript 进行解析

1.5JSON 数据可使用 AJAX 进行传输



2、相比 XML 的不同之处



    * 没有结束标签

    * 更短

    * 读写的速度更快

    * 能够使用内建的 JavaScript eval() 方法进行解析

    * 使用数组

    * 不使用保留字





3、为什么使用 JSON？

     3.1对于 AJAX 应用程序来说，JSON 比 XML 更快更易使用：

     3.2使用 XML

读取 XML 文档

使用 XML DOM 来循环遍历文档

读取值并存储在变量中

     3.3使用 JSON

读取 JSON 字符串

用 eval() 处理 JSON 字符串



3语法



1、JSON 语法规则

     1.1JSON 语法是 JavaScript 对象表示法语法的子集。



    * 数据在名称/值对中

    * 数据由逗号分隔

    * 花括号保存对象

    * 方括号保存数组





2、JSON 名称/值对

     2.1JSON 数据的书写格式是：名称/值对。

"firstName" : "John"





3、JSON 值

     3.1JSON 值可以是：



    * 数字（整数或浮点数）

    * 字符串（在双引号中）

    * 逻辑值（true 或 false）

    * 数组（在方括号中）

    * 对象（在花括号中）

    * null





4、JSON 对象

     4.1JSON 对象在花括号中书写：

{ "firstName":"John" , "lastName":"Doe" }





5、JSON 数组

     5.1JSON 数组在方括号中书写：

{

"employees": [

{ "firstName":"John" , "lastName":"Doe" },

{ "firstName":"Anna" , "lastName":"Smith" },

{ "firstName":"Peter" , "lastName":"Jones" }

]

}





6、JSON 使用 JavaScript 语法

     6.1因为 JSON 使用 JavaScript 语法，所以无需额外的软件就能处理 JavaScript 中的 JSON。

var employees = [

{ "firstName":"Bill" , "lastName":"Gates" },

{ "firstName":"George" , "lastName":"Bush" },

{ "firstName":"Thomas" , "lastName": "Carter" }

];





7、JSON 文件



    * JSON 文件的文件类型是 ".json"

    * JSON 文本的 MIME 类型是 "application/json"





4使用



1、把 JSON 文本转换为 JavaScript 对象

     1.1JSON 最常见的用法之一，是从 web 服务器上读取 JSON 数据（作为文件或作为 HttpRequest），将 JSON 数据转换为 JavaScript 对象，然后在网页中使用该数据。



2、JSON 实例 - 来自字符串的对象

var txt = '{ "employees" : [' +

'{ "firstName":"Bill" , "lastName":"Gates" },' +

'{ "firstName":"George" , "lastName":"Bush" },' +

'{ "firstName":"Thomas" , "lastName":"Carter" } ]}';





3、JSON 解析器

Web 浏览器支持Web 软件支持

    * Firefox (Mozilla) 3.5

    * Internet Explorer 8

    * Chrome

    * Opera 10

    * Safari 4





    * jQuery

    * Yahoo UI

    * Prototype

    * Dojo

    * ECMAScript 1.5