• js操作json


    一、什么是json?

    json英文全称 JavaScript Object Notation,是一种易于理解的轻量级数据交换格式。

    JSON 作用:用于存储和传输数据的格式。 通常用于服务端向网页传递数据 。

    二、语法规则

    • 数据为 键/值 对。
    • 数据由逗号分隔。
    • 大括号保存对象
    • 方括号保存数组

      json对象的代码示例:

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

      json数组的代码示例:

      "employees":[
        {"firstName":"John", "lastName":"Doe"}, 
        {"firstName":"Anna", "lastName":"Smith"}, 
        {"firstName":"Peter", "lastName":"Jones"}
      ]

    三、json的操作

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

      相关代码示例:

      <!DOCTYPE html>
      <html>
        <head>
          <meta charset="utf-8">
          <title>菜鸟教程(runoob.com)</title>
        </head>
        <body>
          <h2>从 JSON 字符串中创建对象</h2>
          <p>
            名: <span id="fname"></span><br>
            姓: <span id="lname"></span><br>
          </p>
          <script>
            var txt = '{"employees":[' +
            '{"firstName":"John","lastName":"Doe" },' +
            '{"firstName":"Anna","lastName":"Smith" },' +
            '{"firstName":"Peter","lastName":"Jones" }]}';

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

            document.getElementById("fname").innerHTML=obj.employees[1].firstName
            document.getElementById("lname").innerHTML=obj.employees[1].lastName
          </script>
         </body>
        </html>

        JSON.parse() 方法用于将一个 JSON 字符串转换为对象。

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

        参数:

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

        相关示例:

        <!DOCTYPE html>

        <html>

          <head>

            <meta charset="utf-8">
            <title>菜鸟教程(runoob.com)</title>
          </head>
        <body>

          <h2>从 JSON 字符串中创建一个对象</h2>
          <p id="demo"></p>
        <script>
          var text = '{"employees":[' +
          '{"name":"菜鸟教程","site":"http://www.runoob.com" },' +
          '{"name":"Google","site":"http://www.Google.com" },' +
          '{"name":"Taobao","site":"http://www.taobao.com" }]}';
          obj = JSON.parse(text);
          document.getElementById("demo").innerHTML =
          obj.employees[1].name + " " + obj.employees[1].site;
        </script>

       </body>
      </html>

      选参:

        <!DOCTYPE html>

        <html>
        <head>
          <meta charset="utf-8">
          <title>菜鸟教程(runoob.com)</title>
        </head>
        <body>

          <h2>使用可选参数,回调函数</h2>
          <p id="demo"></p>
          <script>
            JSON.parse('{"p": 5}', function(k, v) {
            if (k === '') { return v; }
            return v * 2;
            });
            JSON.parse('{"1": 1, "2": 2, "3": {"4": 4, "5": {"6": 6}}}', function(k, v) {
            document.write( k );// 输出当前属性,最后一个为 ""
            document.write("<br>");
            return v; // 返回修改的值
            });
          </script>

        </body>
       </html>

       JSON.stringify方法用于将一个值转为字符串。该字符串应该符合JSON格式,并且可以被JSON.parse方法还原。

       语法:JSON.stringify(value[, replacer[, space]]) 

        参数说明:

      • value:

        必需, 一个有效的 JSON 字符串。

      • replacer:

        可选。用于需要转成字符串的属性。。

        如果 replacer 为函数,则 JSON.stringify 将调用该函数,并传入每个成员的键和值。使用返回值而不是原始值。如果此函数返回 undefined,则排除成员。根对象的键是一个空字符串:""。

        如果 replacer 是一个数组,则仅转换该数组中具有键值的成员。成员的转换顺序与键在数组中的顺序一样。当 value 参数也为数组时,将忽略 replacer 数组。

      • space:

        可选,文本添加缩进、空格和换行符,用于增加返回的JSON字符串的可读性。如果是数字,表示每个属性前面添加的空格(最多不超过10个);如果是字符串(不超过10个字符),则该字符串会添加在每行前面。

       相关代码示例:

        <!DOCTYPE html>

        <html>
          <head>
            <meta charset="utf-8">
            <title>菜鸟教程(runoob.com)</title>
          </head>
          <body>

            <p id="demo"></p>
            <script>
              var str = {"name":"菜鸟教程", "site":"http://www.runoob.com"}
              str_pretty1 = JSON.stringify(str)
              document.write( "只有一个参数情况:" );
              document.write( "<br>" );
              document.write("<pre>" + str_pretty1 + "</pre>" );
              document.write( "<br>" );
              str_pretty2 = JSON.stringify(str, null, 4) //使用四个空格缩进
              document.write( "使用参数情况:" );
              document.write( "<br>" );
              document.write("<pre>" + str_pretty2 + "</pre>" ); // pre 用于格式化输出
            </script>

          </body>
        </html>

        由 JSON.stringify 方法用于允许转换某个对象的数据以进行 JavaScript Object Notation (JSON) 序列化。

        语法:objectname.toJSON()

        参数:objectname必需。  需要进行 JSON 序列化的对象。  

        代码示例:

        使用 toJSON 方法将大写的字符串成员值序列化。  在调用 JSON.stringify 时调用 toJSON 方法。  

        var contact = new Object();

         contact.firstname = "Jesper";

         contact.surname = "Aaberg";

         contact.phone = ["555-0100", "555-0120"];

         contact.toJSON = function(key           var replacement = new Object();

           for (var val in this)
          {
              if (typeof (this[val]) === 'string')
                  replacement[val] = this[val].toUpperCase();
              else
                  replacement[val] = this[val]
          }
          return replacement;
      };
    
      var jsonText = JSON.stringify(contact);
    
      /* The value of jsonText is:
      '{"firstname":"JESPER","surname":"AABERG","phone":["555-0100","555-0120"]}'
      */
      
    以下示例演示如何使用作为 Date 对象的内置成员的 toJSON 方法。 
      var dt = new Date('8/24/2009');
      dt.setUTCHours(7, 30, 0);
      var jsonText = JSON.stringify(dt);
    
      /* The value of jsonText is:
      '"2009-08-24T07:30:00Z"'
      */
     
     
  • 相关阅读:
    x64 平台开发 Mapxtreme 编译错误
    hdu 4305 Lightning
    Ural 1627 Join(生成树计数)
    poj 2104 Kth Number(可持久化线段树)
    ural 1651 Shortest Subchain
    hdu 4351 Digital root
    hdu 3221 Bruteforce Algorithm
    poj 2892 Tunnel Warfare (Splay Tree instead of Segment Tree)
    hdu 4031 Attack(BIT)
    LightOJ 1277 Looking for a Subsequence
  • 原文地址:https://www.cnblogs.com/john-sr/p/5824542.html
Copyright © 2020-2023  润新知