(77)Wangdao.com第十五天_JavaScript 用於數據交換的文本格式 JSON 對象

JSON 對象

JSON （JavaScript Object Notation 的縮寫）

也是一種數據，是 JavaScript 的原生對象，用來處理 JSON 格式數據。它有兩個靜態方法：JSON.stringify() 和  JSON.parse()

是一種無序的屬性名和屬性值的集合，用於網站的先後臺交互。

• 在先後臺交互的時候，雖然數據的格式是 json，但要用字符串的形式進行傳遞
• 發送時，使用 JSON.stringify( json對象 ) 將 json 對象轉換成字符串。
• 接收時，用 JSON.parse(字符串形式的 json ) 解析成 json 對象。
  

  var p = {
      name: '周杰倫',
      age: 40
  };
  
  var jsonObj = { "name":"陶喆", "age":"45", "gender":"true", }; 
  // 發送
  var jsonStr = JSON.stringify(jsonObj); // 
  
  // 接收
  var jsonObj = JSON.parse(jsonStr); // 
  
  // for...in...遍歷 json對象
  for var k in jsonObj{
      console
  }

   

• JSON 格式是用於數據交換的文本格式
  • 2001年由 Douglas Crockford 提出，目的是取代繁瑣笨重的 XML 格式。
  • JSON 迅速被接受，已經成爲各大網站交換數據的標準格式，並被寫入標準。
  • 目的是取代繁瑣笨重的 XML 格式。
  • 兩個顯著的優勢：
    • 書寫簡單，一目瞭然；
    • 符合 JavaScript 原生語法，能夠由解釋引擎直接處理，不用另外添加解析代碼。

 

• 每一個 JSON 對象就是一個值，多是一個數組或對象，也多是一個原始類型的值。總之，只能是一個值，不能是兩個或更多的值。

 

• JSON 對值的類型和格式有嚴格的規定
  • 複合類型的值只能是數組或對象，不能是函數、正則表達式對象、日期對象
  • 原始類型的值只有四種：字符串、數值（必須以十進制表示）、布爾值和null（不能使用NaN, Infinity, -Infinity和undefined）
  • 字符串必須使用雙引號表示，不能使用單引號
  • 對象的鍵名必須放在雙引號裏面
  • 數組或對象最後一個成員的後面，不能加逗號

 

• JSON.stringify()
• 第一個參數爲JSON對象，將轉爲 ' JSON 字符串' 。該字符串符合 JSON 格式，而且能夠被 JSON.parse 方法還原
• 第一個參數若是是原始類型的字符串，結果會帶雙引號，轉換爲 "JSON字符串"。
  • 這是由於未來還原的時候，內層雙引號可讓 JavaScript 引擎知道，這是一個字符串，而不是其餘類型的值

    JSON.stringify('foo') === "foo"     // false
    JSON.stringify('foo') === "\"foo\""     // true
    //字符串foo，被轉成了"\"foo"\"。
    // 這是由於未來還原的時候，內層雙引號可讓 JavaScript 引擎知道，這是一個字符串，而不是其餘類型的值
    
    
    JSON.stringify(false);     // "false"
    // 因爲沒有內層雙引號，因此原始值是布爾，而不是字符串
    
    JSON.stringify('false');     // "\"false\""

     

• 若是對象的屬性值是 undefined、函數或 XML 對象，該屬性會被 JSON.stringify 過濾
• 若是數組的成員是undefined、函數或 XML 對象，則這些值被轉成 null
• 正則對象會被轉成空對象    JSON.stringify(/foo/)        // "{}"
• • 會忽略對象的不可遍歷的屬性
    

    • var obj = {};
      Object.defineProperties(obj, {
          'foo': {
              value: 1,
              enumerable: true
          },
          'bar': {
              value: 2,
              enumerable: false
          }
      });
      
      JSON.stringify(obj);    // "{"foo":1}"

       

  • 還能夠接受接受一個數組，做爲第二個參數，指定須要轉成字符串的屬性。。。只對對象的屬性有效，對數組無效
    • 指定要解析的屬性

      • var obj = {
            'prop1': 'value1',
            'prop2': 'value2',
            'prop3': 'value3'
        };
        
        var selectedProperties = ['prop1', 'prop2'];
        
        JSON.stringify(obj, selectedProperties);   //{"prop1":"value1","prop2":"value2"}"

         

  • 第二個參數還能夠是一個函數，用來更改 JSON.stringify 的返回值
  • 函數，接受兩個參數，分別是被轉換的對象的鍵名和鍵值
  • 遞歸處理全部的鍵。每次遞歸處理前一次修改後的對象
  • 若是處理函數返回undefined或沒有返回值，則該屬性會被忽略o
    

    • function f(key, value) {
          if (typeof value === "number") {
              value = 2 * value;
          }
          return value;
      }
      
      JSON.stringify({ a: 1, b: 2 }, f);    // '{"a": 2,"b": 4}'

       

  • 還能夠接受第三個參數，用於增長返回的 JSON 字符串的可讀性。
    • 若是是數字，表示每一個屬性前面添加的空格（最多不超過10個）
    • 若是是字符串（不超過10個字符），則該字符串會添加在每行前面

      • JSON.stringify({ p1: 1, p2: 2 }, null, 2);
        /*
        "{
          "p1": 1,
          "p2": 2
        }"
        */
        
        JSON.stringify({ p1:1, p2:2 }, null, '|-');
        /*
        "{
        |-"p1": 1,
        |-"p2": 2
        }"
        */

         

  • 第一個參數，即JSON對象，若是含有 toJSON() 方法，則直接使用這個方法的返回值做爲參數，而忽略原對象的其餘參數
  • Date 就擁有本身的 toJSON() 方法
  • toJSON方法的一個應用是，將正則對象自動轉爲字符串。JSON.stringify默認不能轉換正則對象，可是設置了toJSON方法之後，就能夠轉換正則對象了

    var obj = {
      reg: /foo/
    };
    
    // 不設置 toJSON 方法時
    JSON.stringify(obj) // "{"reg":{}}"
    
    // 設置 toJSON 方法時
    RegExp.prototype.toJSON = RegExp.prototype.toString;
    JSON.stringify(/foo/) // ""/foo/""

     

• JSON.parse()
  • 用於將 JSON 字符串轉換成對應的值
  • 若是傳入的字符串不是有效的 JSON 格式，JSON.parse方法將報錯
  • 爲了處理解析錯誤，能夠將JSON.parse方法放在try...catch代碼塊中

    • try {
          JSON.parse("'String'");
      } catch(e) {
          console.log('parsing error');
      }

       

  • 能夠接受一個處理函數，做爲第二個參數，用法與JSON.stringify方法相似

    • function f(key, value) {
          if (key === 'a') {
              return value + 10;
          }
          return value;
      }
      
      JSON.parse('{"a": 1, "b": 2}', f);    // {a: 11, b: 2}