json学习笔记

写在前面

1. JSON简介

JSON是一种存储和交换数据的语法；
JSON 是通过Javascript对象标记法书写的文本；

1.1 交换数据

1. 在浏览器和服务器之间进行数据交换时，只能采用文本的形式，而不能采用对象；
2. JSON属于文本，能够把任何JavaScript 对象转换为JSON，然后将其发送给服务器；
3. 从服务器接收到的数据文本也可以通过JSON的方式转换为对象；

1. 发送数据
   数据如果是存储在JavaScript对象中，转换为json之后发送给服务器；

var myObj = {name: "bill Gites", age: 453; city: "beijing"};
var myJSON = {JSON.stringify(myobj)};
window.location = "demo_json.php?"  + myJSON;

2. 接收数据
   myObj = JSON.parse(muJSON); 是将接收到的文本数据转换为JavaScript对象；
3. 存储数据

myJSON =  JSON.stringify(myObj);		  //将对象转换为文本
localStorage.setItem("testJSON", myJSON); //存储
text = localStorage.getTtem("testJSON");  //取数据

2 JSON语法

json数据写为名称/值对，由名称和值字段构成，后跟冒号和值；

json	javascript
名称需要双引号	名称不需要双引号
值数据类型: (字符串，数字，JSON对象，数组，布尔，null)	值类型： (字符串，数字，JSON对象，数组，布尔，null，函数，日期，undefined)

3 json.parse()

函数释义：是将文本转换为对象；

3.1 来自服务器的JSON

var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function()  {
    if (this.readyState == 4 && this.status == 200) {
        myObj =  JSON.parse(this.responseText);
        document.getElementById("demo").innerHTML  = myObj.name;
    }
};
xmlhttp.open("GET", "json_demo.txt", true);
xmlhttp.send();

3.2 解析日期

JSON中不允许日期对象，如果需要包含日期，请写为字符串，然后将其转换回日期对象；

var text =  '{ "name":"Bill Gates", "birth":"1955-10-28", "city":"Seattle"}';
var obj = JSON.parse(text);
obj.birth = new Date(obj.birth);
document.getElementById("demo").innerHTML = obj.name + ", " + obj.birth;

3.2 解析函数

少用就对了，函数会丢失他们的作用域，还有使用eval()把他们还原会函数。

var text =  '{ "name":"Bill Gates", "age":"function () {return 62;}", "city":"Seattle"}';
var obj = JSON.parse(text);
obj.age = eval("(" + obj.age + ")");

4 JSON.stringify()

函数释义：将JavaScript对象转换为字符串。

var obj = { name:"Bill Gates", age:62, city:"Seattle"};
var myJSON =  JSON.stringify(obj);
document.getElementById("demo").innerHTML = myJSON;

5 JSON 数组

var myObj, i, x;
myObj =  {
  "name":"Bill Gates",
  "age":62,
  "cars":[ "Porsche", "BMW", "Volvo" ]
};
//遍历数组
for (x in myobj.cars) {
	document.getElementById("demo").innerHTML = x;
}
myObj.cars[1] = "wgfegeg";	//修改数组值
delete myObj.car[1];	//删除数组项目

6 JSONP

jsonp是一种无需考虑跨域问题即可传送JSON数据的方法；
jsonp不使用XMLHttpRequest对象。
jsonp使用<script>标签取而代之；