zoukankan      html  css  js  c++  java
  • js中JSON的解析(将json字符串转化为对象)和序列化(将对象转化为json字符串)(函数的功能一般都挺全的,需要的时候去查看完整函数)

    js中JSON的解析(将json字符串转化为对象)和序列化(将对象转化为json字符串)(函数的功能一般都挺全的,需要的时候去查看完整函数)

    一、总结

    1、JSON解析:JSON.parse(myJSONtext);

    2、JSON序列化:JSON.stringify(myObject);

    3、一般函数的功能都很全,很多我们不常用的功能都有,可选参数,需要特殊功能的时候去查完整的函数

    二、js中JSON的解析(将json字符串转化为对象)和序列化(将对象转化为json字符串)

    JSON 的解析和序列化

    一般情况下,我们的json数据都是从服务端获取到的,获取的json数据是以字符串的形式返回的。这个字符串虽然是json格式的,但是不能被直接使用,我们必须将该字符串转化为一个对象才能正常解析它

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

      eval()函数可编译并执行任何 JavaScript 代码。这隐藏了一个潜在的安全问题。(如果JSON中包含恶意代码也会被直接执行)

    • 使用 JSON 解析器将 JSON 转换为 JavaScript 对象是更安全的做法。JSON解析器只会识别JSON文本,而不会执行。
      • JSON 的解析:json数据转换成js对象

        语法:var myObject = JSON.parse(myJSONtext, reviver);

      • JSON的序列化:js对象转换成json数据(字符串)

        语法:var myJSONText = JSON.stringify(myObject, replacer);

    对于较老的浏览器,可使用 JavaScript 库: https://github.com/douglascrockford/JSON-js

    三、代码

    json解析

      1 <!DOCTYPE html>
      2 <html lang="zh-cn">
      3 <head>
      4   <meta charset="utf-8">
      5   <title>课堂演示</title>
      6 </head>
      7 <body>
      8   <script>
      9   //实际使用的时候json数据需要从服务器加载,这里假定下面的数据是从服务器加载过来的,来演示后续的操作。
     10   var jsonstr='[{"name":"aaa","age":30},{"name":"bbb","age":25},{"name":"ccc","age":18}]';
     11   //alert(typeof(jsonstr))
     12  //json数据转换成js对象
     13     //var jsonobj=JSON.parse(jsonstr);
     14     //alert(jsonstr)
     15    // alert(jsonobj[0].name)
     16     //alert(typeof(jsonobj))
     17 
     18     var jsonobj=JSON.parse(jsonstr,function(key,value){ //1、第二个参数,解析式时替换
     19         if ((key=='name')) {
     20           return 'VIP会员:'+value;
     21         }else{return value}
     22     });
     23 
     24   alert(jsonobj[0].age)
     25   </script>
     26 </body>
     27 </html>
    

    json序列化

      1 <!DOCTYPE html>
      2 <html lang="zh-cn">
      3 <head>
      4   <meta charset="utf-8">
      5   <title>课堂演示</title>
      6 </head>
      7 <body>
      8   <script>
      9   var jsonobj=[ //2、json对象
     10   {
     11     name:'aaa',
     12     age:30,
     13     lv:2
     14   },
     15   {
     16     name:'bbb',
     17     age:25,
     18     lv:1
     19   }
     20   ]
     21 
     22   //alert(jsonobj[0].name+'
    '+jsonobj[0].age+'
    '+jsonobj[0].lv)
     23 
     24   // var jsonstr=JSON.stringify(jsonobj)
     25   // alert(typeof(jsonobj))
     26   // alert(typeof(jsonstr))
     27 
     28   //第二个参数
     29   // var jsonstr=JSON.stringify(jsonobj,['name','lv'])
     30   // alert(jsonstr)
     31   // var jsonstr=JSON.stringify(jsonobj,function(key,value){
     32   //   if (key=='lv') {
     33   //     return '等级为:'+value
     34   //     }else{return value}
     35   //   })
     36   // alert(jsonstr)
     37 
     38   //第三个参数表示缩进
     39    var jsonstr=JSON.stringify(jsonobj,null,4) //3、函数还有其余参数
     40    alert(jsonstr)
     41   </script>
     42 </body>
     43 </html>
    
  • 相关阅读:
    Javascript面向对象(三):非构造函数的继承
    Javascript面向对象(二):构造函数的继承
    Javascript 面向对象(一):封装
    .NET面试题系列[12]
    .NET面试题系列[11]
    .NET面试题系列[10]
    .NET面试题系列[9]
    .NET面试题系列[8]
    .NET面试题系列[7]
    .NET面试题系列[6]
  • 原文地址:https://www.cnblogs.com/Renyi-Fan/p/9038747.html
Copyright © 2011-2022 走看看