javascript中的原生JSON对象

港控/mmm° 2022-05-15 10:58 261阅读 0赞

*  JSON( Javascript Object Notation)，是一种轻量级的，原生的数据交换格式。
 *  JSON对象的定义和属性的获取（前面提到过的js对象定义的第三种）。

var jsonObj = {
       "id":"1","name":"zhangsan"};
    jsonObj.id；
    jsonObj["name"];

*  JSON对象和字符串之间的相互转化。

**演示代码：**

//将JSON对象转为字符串
    var jsonObj = {
       "id":"1","name":"zhangsan"};
    var jsonStr = JSON.stringify(jsonObj);
    //将字符串转为json对象(两种方式)
    var str = '{"name":"iPhone","price":"5888"}';
    var toJsonObj = JSON.parse(str);
    //又或者
    var toJsonObj2 = eval("("+str+")");

<!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>关于JS中的原生JSON</title>
        <script src="js/jq1.12.js" type="text/javascript"></script>
    </head>
    <body>
    </body>
    <script> //这之前要回顾一下js中是如何定义对象，如何访问它的属性和方法的 //定义JSON对象，以及JSON对象和字符串的相互转换 //定义了一个json对象(注意不要加引号，否则它就是普通字符串了，没法使用点和中括号运算符了) var jsonObj = { "id":"1","name":"zhangsan"}; document.write(jsonObj.id+"<br/>"); document.write(jsonObj["name"]+"<br/>"); //增加属性 jsonObj.sex = '男'; document.write(jsonObj.sex+"<br/>"); //修改属性 jsonObj.sex = '女'; document.write(jsonObj.sex+"<br/>"); //删除属性 delete jsonObj.id; document.write(jsonObj.id+"<br/>"); //将JSON对象转为字符串 var jsonStr = JSON.stringify(jsonObj); document.write(jsonStr+"<br/>"); //将字符串转为json对象(两种方式) var str = '{"name":"iPhone","price":"5888"}'; var toJsonObj = JSON.parse(str); var toJsonObj2 = eval("("+str+")"); document.write(toJsonObj.name+"<br/>"); document.write(toJsonObj.price+"<br/>"); document.write(toJsonObj2.name+"<br/>"); document.write(toJsonObj2.price+"<br/>"); //这之前要回顾一下js中的数组 //JSON数组 [{},{},{}...] var jsonArr = [{ "id":"1","name":"zhangsan"},{ "id":"2","name":"lisi"},{ "id":"3","name":"wangwu"}]; for(var i = 0; i < jsonArr.length;i++){ document.write(jsonArr[i].id+"---"+jsonArr[i].name+"<br/>"); } //将JSON数组转为字符串 var str2 = JSON.stringify(jsonArr); document.write(str2+"<br/>"); //其实列举了这么多，还是要解决如何在js中解析servlet响应过来的JSON格式的数据，以及在前端页面格式化输出 </script>
    </html>

![这里写图片描述][70]

[70]: /images/20220515/e9136cdce3824a578bef1d354f316df2.png