01JSON

1.JSON

1.1概念

JSON(JavaScript Object Nation)JAvaScript对象表示法,是用来储存和交换轻量级文本信息的语法,JSON 使用 Javascript语法来描述数据对象,但是 JSON 仍然独立于语言和平台。JSON 解析器和 JSON 库支持许多不同的编程语言。 目前非常多的动态(PHP,JSP,.NET)编程语言都支持JSON。

1.2JSON/语法

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

  • 数据在名称(兼)/值对中 key:value

  • 数据由逗号分隔

  • 大括号{}保存对象

  • 中括号[]保存数组,数组可以存多个对象

    let jsonObject = {"name":"Bob","age":18}
    

JSON值:

  • 数字(整数或浮点)

  • 字符串(在双引号中)

  • 逻辑值(false,true)

  • 数组(在中括号中)

  • 对象(在大括号中)

  • null

    let jsonObject = {
      "age":18,
      "name":"TanPengfei",
      "isMarried":false,
      "abilitiy":{"software":"c c++","hardware":"fpga verilog"},
      "roomMates":[
          {"name":"Hanqi","age":18},
          {"name":"Tainhao","age":18},
          {"name":"Zhiliang","age":18},
      ]
    }
    
    //从JSON对象中取数据
    console.log(jsonObject.name)  //TanPengfei
    console.log(jsonObject.ability.software) //c c++
    console.log(jsonObject.roomMates[0].name)  //Hanqi
    

1.3JSON文件

  • JSON文件的文件类型是.json
  • JSON文本的MIME类型为application/json

2.JSON对象

2.1语法

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

  • 对象可以包含多个 key/value(键/值)对。

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

  • key 和 value 中使用冒号(:)分割。每个 key/value 对使用逗号(,)分割。

  • 使用.来访问对象的值

    var myObj, x
    myObj = { "name":"runoob", "alexa":10000, "site":null }
    //使用 . 来访问对象的值
    x = myObj.name //"runoob"
    //使用 [] 来访问对象的值
    x = myObj["name"] //"runoob"
    
    
    

2.2循环对象与嵌套对象

  • 使用for-in来循环对象的属性

    var myObj = { "name":"runoob", "alexa":10000, "site":null };
    for (x in myObj) {
        document.getElementById("demo").innerHTML += x + "
    "; }
  • 嵌套对象

    myObj = {
        "name":"runoob",
        "alexa":10000,
        "sites": {
            "site1":"www.runoob.com",
            "site2":"m.runoob.com",
            "site3":"c.runoob.com"
        }
    }
    

2.3操做对象属性

  • 修改:与普通的js对象的操作一样

    //方法1
    myObj.sites.site1 = "www.google.com";
    //方法2
    myObj.sites["site1"] = "www.google.com";
    
  • 删除:使用 delete 关键字来删除 JSON 对象的属性

    //方法1
    delete myObj.sites.site1;
    //方法2
    delete myObj.sites.site1;
    

3.JSON数组(基本与json对象一致)

4.JSON的两大方法

4.1 JSON.parse()

  1. 语法:JSON.parse(text[, reviver])

    • text:必需, 一个有效的 JSON 字符串
    • reviver: 可选,一个转换结果的函数, 将为对象的每个成员调用此函数
  2. 实例:

    //通过使用AJAX从服务器请求JSON数据,并解析出js对象
    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", "/try/ajax/json_demo.txt", true);
xmlhttp.send();


3. 注意:

   - JSON 不能存储 Date 对象。如果你需要存储 Date 对象,需要将其转换为字符串。之后再将字符串转换为 Date 对象。

     ```
     var text = '{ "name":"Runoob", "initDate":"2013-12-14", "site":"www.runoob.com"}';
     var obj = JSON.parse(text);
     obj.initDate = new Date(obj.initDate);
      
     document.getElementById("demo").innerHTML = obj.name + "创建日期: " + obj.initDate;
     ```

     

   - JSON 不允许包含函数,但你可以将函数作为字符串存储,之后再将字符串转换为函数

     ```
     var text = '{ "name":"Runoob", "alexa":"function () {return 10000;}", "site":"www.runoob.com"}';
     var obj = JSON.parse(text);
     obj.alexa = eval("(" + obj.alexa + ")");
      
     document.getElementById("demo").innerHTML = obj.name + " Alexa 排名:" + obj.alexa();
     
     ```

     

### 4.2JSON.stringify()

1. 语法:JSON.stringify(value[, replacer[, space]])
- **value:**必需, 要转换的 JavaScript 值(通常为对象或数组)。
- **replacer:**可选。用于转换结果的函数或数组。
- **space:**可选,文本添加缩进、空格和换行符

2. 对象转换

var obj = { "name":"runoob", "alexa":10000, "site":"www.runoob.com"};
var obj = { "name":"runoob", "alexa":10000, "site":"www.runoob.com"};


3. 注意
- JSON 不能存储 Date 对象。JSON.stringify() 会将所有日期转换为字符串。
- JSON 不允许包含函数,JSON.stringify() 会删除 JavaScript 对象的函数,包括 key 和 value。

你可能感兴趣的:(01JSON)