1 JSON简介

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

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

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

什么是JSON？

l JSON 指的是 JavaScript 对象表示法（JavaScript Object Notation）

l JSON 是轻量级的文本数据交换格式

l JSON 独立于语言 *

l JSON 具有自我描述性，更易理解

* JSON 使用 JavaScript 语法来描述数据对象，但是 JSON 仍然独立于语言和平台。JSON 解析器和 JSON 库支持许多不同的编程语言。

实战代码：
<script type="text/javascript">
  var JSONObject = {
    "name": "Bill Gates",
    "street": "Fifth Avenue New York 666",
    "age": 56,
    "phone": "555 1234567"
  };
document.getElementById("jname").innerHTML = JSONObject.name
document.getElementById("jage").innerHTML = JSONObject.age
document.getElementById("jstreet").innerHTML = JSONObject.street
document.getElementById("jphone").innerHTML = JSONObject.phone
</script>

2 JSON语法

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

数据在名称/值对中
数据由逗号分隔
花括号保存对象
方括号保存数组

JSON值

数字（整数或浮点数）

字符串（在双引号中）

逻辑值（true 或 false）

数组（在方括号中）

对象（在花括号中）

null

JSON对象（1）

JSON对象在花括号中书写：

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

JSON对象数组（2）

JSON数组在方括号中书写，数组可包含多个对象：

{
  "employees": [
        { "firstName":"John" , "lastName":"Doe" },
        { "firstName":"Anna" , "lastName":"Smith" },
        { "firstName":"Peter" , "lastName":"Jones" }
    ]
}
该例子中，对象"employees" 是包含3个对象的数组。

实例：

<script type="text/javascript">
  var employees = [

    { "firstName": "Bill", "lastName": "Gates" },
    { "firstName": "George", "lastName": "Bush" },
    { "firstName": "Thomas", "lastName": "Carter" }
  ];

// employees[0].firstName  获取数据Bill

employees[1].firstName = "Jobs"; //修改数据
document.getElementById("fname").innerHTML = employees[1].firstName;
</script>

3 JSON对象-访问对象值

对象语法：

JSON 对象使用在大括号{}中书写。

对象可以包含多个 key/value（键/值）对。

key 必须是字符串，value 可以是合法的 JSON 数据类型（字符串, 数字, 对象, 数组, 布尔值或 null）。

key 和 value 中使用冒号(:)分割。

每个 key/value 对使用逗号(,)分割。

访问对象值

你可以使用点号来访问JSON对象的值：

<script>
  var myObj, x;
	myObj = { "name": "JS中文教程网", "alexa": 10000, "site": "www.8939.org" };
	x = myObj.name;
	document.getElementById("demo").innerHTML = x;
</script>

嵌套JSON对象

<body>
    <p id="demo"></p>
    <script>
        var myObj, i, x = "";
        myObj = {
            "name": "runoob",
            "alexa": 10000,
            "sites": {
                "site1": "www.runoob.com",
                "site2": "m.runoob.com",
                "site3": "c.runoob.com"
            }
        }
        myObj.sites["site2"]="www.google.com";//修改JSON对象的值
        delete myObj.sites.site1; //删除JSON对象属性
        //或者 delete myObj.sites["site1"];
        for (i in myObj.sites) {
            x += myObj.sites[i] + "<br>";
        }
        document.getElementById("demo").innerHTML = x;
    </script>
</body>

基本数组

<script>
    var myObj, x;
    myObj = [ "Google", "Runoob", "Taobao" ];
    x = myObj[0];
    document.getElementById("demo").innerHTML = x;
    for ( y in myObj) {
    document.getElementById("demo2").innerHTML += myObj[y] + "<br>";
    }
</script>

对象中的数组

<script>
    var myObj, i, j, x = "";
    myObj = {
        "name":"网站",
        "num":3,
        "sites": [
            { "name":"Google", "info":[ "Android", "Google 搜索", "Google 翻译" ] },
            { "name":"Runoob", "info":[ "菜鸟教程", "菜鸟工具", "菜鸟微信" ] },
            { "name":"Taobao", "info":[ "淘宝", "网购" ] }
        ]
    }
    for (i in myObj.sites) {
        x += "<h1>" + myObj.sites[i].name + "</h1>";
        for (j in myObj.sites[i].info) {
            x += myObj.sites[i].info[j] + "<br>";
        }
    }
    document.getElementById("demo").innerHTML = x;
</script>  
</body>

JSON实例 -来自字符串的对象「eval()」

JavaScript函数eval()可用于将JSON文本转换为JavaScript对象。

eval（）函数使用的是JavaScript编辑器，可解析JSON文本，然后生成JavaScript对象。必须把文本包围在括号中，这样才能避免语法错误：

var obj = eval ("(" + txt + ")");

<script>
var txt = '{ "sites" : [' +
'{ "name":"JS中文教程网" , "url":"www.8939.org" },' +
'{ "name":"google" , "url":"www.google.com" },' +
'{ "name":"微博" , "url":"www.weibo.com" } ]}';
var obj = eval ("(" + txt + ")");//把JSON文本转换为JavaScript对象
document.getElementById("name").innerHTML=obj.sites[0].name
document.getElementById("url").innerHTML=obj.sites[0].url
</script>

JSON实例 -来自字符串的对象「JSON.parse() 」

JSON 通常用于与服务端交换数据。

在接收服务器数据时一般是字符串。

我们可以使用 JSON.parse() 方法将数据转换为 JavaScript 对象

<script>
var txt = '{ "sites" : [' +
'{ "name":"JS中文教程网" , "url":"www.8939.org" },' +
'{ "name":"google" , "url":"www.google.com" },' +
'{ "name":"微博" , "url":"www.weibo.com" } ]}';
var str='{ "name":"JS中文教程网", "alexa":10000, "site":"www.8939.org" }';
var obj = JSON.parse(str);
document.getElementById("demo").innerHTML = obj.name + "：" + obj.site;
</script>

JSON.parse()与eval（）的区别？

json格式非常受欢迎，而解析json的方式通常用JSON.parse()但是eval()方法也可以解析，这两者之间有什么区别呢？

JSON.parse()之可以解析json格式的数据，并且会对要解析的字符串进行格式检查，如果格式不正确则不进行解析，而eval()则可以解析任何字符串，eval是不安全的。

JSON实例-JSON对象转字符串「JSON.stringify() 」

JSON 通常用于与服务端交换数据。

在向服务器发送数据时一般是字符串。

我们可以使用 JSON.stringify() 方法将 JavaScript 对象转换为字符串。

对象转换为字符串
<script>
var obj = { "name":"runoob", "alexa":10000,"site":"www.runoob.com"};
var myJSON = JSON.stringify(obj);
//myJSON 的打印为："{"name":"runoob","alexa":10000,"site":"www.runoob.com"}"
</script>
 
数组转换为字符串
<script>
var arr = [ "Google", "Runoob", "Taobao", "Facebook" ];
var myJSON = JSON.stringify(arr);
// myJSON 打印值为："["Google","Runoob","Taobao","Facebook"]"
</script>

文档：http://www.json.org/json-zh.html

图片来源：https://baijiahao.baidu.com/s?id=1652241214837639808&wfr=spider&for=pc

Jquery param方法

param() 方法创建数组或对象的序列化表示形式。
序列化的值可在生成 AJAX 请求时用于 URL 查询字符串中。

$.param(object,trad)
必需。规定要序列化的数组或对象。
trad可选。布尔值，指定是否使用参数序列化的传统样式。

url在线编码转码： https://tool.oschina.net/encode?type=4

学习是100%不会错的事情，不管你迷茫的时候，不管你无聊的时候，请学习吧。

他日回忆这段时候，不是迷茫不是无聊，是激励的正确时光。

四时宝库

程序员的知识宝库

程序员都应该了解的一种数据格式之 JSON