Json基础（详细讲+案例）

最新推荐文章于 2024-08-28 15:25:54 发布

原创最新推荐文章于 2024-08-28 15:25:54 发布 · 1.7k 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#json

json 专栏收录该内容

3 篇文章

订阅专栏

本文介绍了JSON的基本概念，展示了如何在JavaScript中定义和操作JSON对象，包括单个对象及数组的定义方式，并探讨了JSON在AJAX中的应用及其优势。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

《（一）什么是Json?

json: javascript object notation（js对象符号），不是一种新的技术，而
是一种数据交换格式，xml也是数据交换格式，json对比xml的生成和处理要更加方便。
因此在许多领域，json正逐步取代xml的使用。
（二）Json的使用：这里的主要是Json的几种定义方式而已。在找一个好一点的手册或者是ppt分享给大家咯

1)在JS中，定义对象有二种方式
a)使用function来定义
b)使用JSON格式来定义，JS天生就能解析JSON格式的对象，无需任何第三方类库或工具

var obj = {名称:值，名称:值，名称:function(){}}

    //传统方式第一种，有点老，可能比较少人会用这种了
    <script type="text/javascript">
        //JS传统方式下定义"类"
        function Person(id,name,gender){
            this.id = id;
            this.name = name;
            this.gender = gender;               
        }   
        //JS传统方式下定义"对象"
        var p = new Person(20111008,"赵君","男");
        //显示该用户的信息
        window.alert(p.id);
        window.alert(p.name);
        window.alert(p.gender);
    </script>

//传统方式第二种，传统方式推荐这种咯
<script type="text/javascript">
        //以下使用JSON格式定义的对象
        var p = {
            id:20111008,
            name:"哈哈",
            gender:"男"
        };  
        window.alert("编号：" + p.id);
        window.alert("用户名：" + p.name);
        window.alert("性别：" + p.gender);
    </script>

一次性定义多个Json对象

    <script type="text/javascript">
        var p = [
                {id:1,name:"jack",gender:"male"},
                {id:2,name:"marry",gender:"female"},
                {id:3,name:"sisi",gender:"female"}
        ];

        for(var i = 0 ; i < p.length;i++){
            window.alert(p[i].id+"---"+p[i].name+"------"+p[i].gender);
        }
    </script>

一个可以对象对应着多个属性值

    <script type="text/javascript">
        var p = {
            province:[
                {"city":"广州"},
                {"city":"佛山"},
                {"city":"深圳"}
            ]
        };
    window.alert("你去过了：" + p.province[2].city);
    </script>

    <script type="text/javascript">
        var p = {
            "province1":[
                {city:"广州"},
                {city:"佛山"},
                {city:"深圳"}
            ],
            "province2":[
                {city:"长沙"},
                {city:"株洲"}
            ]
        };
        window.alert(p.province1[2].city);
        window.alert(p.province2[1].city);
    </script>

    <script type="text/javascript">
        var p = {
            "province":["广州","佛山","深圳"]     
        };
        window.alert("你一共去过" + p.province.length+"个城市");
        window.alert("分别是：\n");
        for(var i=0;i<p.province.length;i++){
            window.alert(p.province[i]);
        }
    </script>

（三）javascript接收处理json信息，Json字符串信息，如果本身时json就不需要eval()
通过eval()把接收的json字符串变成真实的对象信息

 //将json字符串转化成json格式,我在ajax代码中是这样写的
 var jsonObject = eval("("+jsonString+")");
 //也可以是
 eval("var info="+jsonString);

这里写图片描述

（四）json使用的好处：

ajax的使用是对带宽、用户等待时间、服务器资源有节省
json的使用是在ajax的基础上对带宽、用户等待时间、服务器资源的进一步去节省。