JSON简介及常用操作

本文介绍了JSON的基本概念,包括其语法特点、JSON字符串与JSON对象的区别,并通过实例展示了如何在JavaScript中进行JSON数据的读写、转换及增删操作。

json是java web常听到的概念,平常只作为数据传输格式来用,具体操作细节也不了解,正好项目需要操作json,就学习下
1、什么是json
JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式。常用于ajax。xml也是一种数据交换格式,但是在ajax中json比xml更快更易使用。网上也有另一种说法,简单地说, JSON 可以将 JavaScript 对象中表示的一组数据转换为字符串(伪对象) ,然后就可以在函数之间轻松地传递这个字符串,或者 在异步应用程序中将字符串从 Web 客户端传递给服务器端程序 。
2、JSON语法
- 数据在名称/值对中 “firstName” : “John”
- 数据由逗号分隔
- 花括号保存对象 { “firstName”:”John” , “lastName”:”Doe” }
- 方括号保存数组 [
{ “firstName”:”John” , “lastName”:”Doe” },
{ “firstName”:”Anna” , “lastName”:”Smith” },
{ “firstName”:”Peter” , “lastName”:”Jones” }
]
3、JSON字符串和JSON对象
这两个概念也是我经常搞混的概念:
json字符串:是指符合json语法的字符串,例如 var objstr=”[{“姓名”:”张三”,”年龄”:”14”,”性别”:”男”},{“姓名”:”王娜”,”年龄”:”13”,”性别”:”女”}]”
json对象:是指符合json语法的js对象,例如 var obj = [{“姓名”:”张三”,”年龄”:”14”,”性别”:”男”},{“姓名”:”王娜”,”年龄”:”13”,”性别”:”女”}]
json字符串和json对象会经常互相转换,这个后面有示例。
4、如何使用json
JSON是JS的一个子集,所以可以在JS中轻松地读,写JSON。读和写JSON都有两种方法,分别是利用”.”操作符和“[key]”的方式。
为了方便展示转换操作,这里首先展示将表格数据转换为json字符串,后再转换为json对象。
(1) 表格数据转换为json字符串
表格代码

<table id="table">
    <tr>
        <td>name</td>
        <td>age</td>
        <td>sex</td>
    </tr>
    <tr>
        <td>张三</td>
        <td>14</td>
        <td></td>
    </tr>
    <tr>
        <td>王娜</td>
        <td>13</td>
        <td></td>
    </tr>
</table>

转换为json字符串js代码如下:

function getJSONStr()
{
    var jsonstr="["
    var rows = $("table").rows;
    var cells =$("table").rows.item(0).cells
    for(var i = 1;i<rows.length;i++){
        jsonstr+="{"
        for(var j = 0;j<cells.length;j++){

            jsonstr+="\"";
            jsonstr+=cells[j].innerHTML;
            jsonstr+="\"";
            jsonstr+=":";
            jsonstr+="\"";
            jsonstr+=rows[i].cells[j].innerHTML;
            jsonstr+="\",";

        }
        jsonstr=jsonstr.substring(0, jsonstr.length-1);
        jsonstr+="},"

    }
    jsonstr=jsonstr.substring(0, jsonstr.length-1);
    jsonstr+="]";
    return jsonstr;
}

结果为:”[{\”姓名\”:\”张三\”,\”年龄\”:\”14\”,\”性别\”:\”男\”},
{\”姓名\”:\”王娜\”,\”年龄\”:\”13\”,\”性别\”:\”女\”}]”
此时表格数据已转换为json字符串
(2)json字符串转换为json对象

    eval("var obj="+objstr);

很简单的一句话就可以把json字符串转换为对象,我们将json字符串转换为json对象是为了更方便操作,此时obj对象等价于
var obj = [{“姓名”:”张三”,”年龄”:”14”,”性别”:”男”},{“姓名”:”王娜”,”年龄”:”13”,”性别”:”女”}]
这里写图片描述
(3) json对象读写数据,可以用利用”.”操作符和“[key]”的方式

//读取json数据下面这两种方式等价
var name = obj[1].name   //结果为张三
var name = obj[1]["name"]  //结果为张三
//修改json数据下面这两种方式等价
obj[1].age = 34 //此时第一条数据中的年龄变为34

这里写图片描述

(4)增加
增加有两种情况,一种是json对象新增一个key/value对,一种是json数组新增一条记录。
新增一个key/value对直接对对象进行写操作即可,新增一条记录代码如下:

function addItem()
{

    var newItem = {
            'name':'lily',
            'age':'45',
            'sex':'女'
    }
    obj.push(newItem);

}

这里写图片描述

(5)删除
删除也有两种情况,删除一个键值对,删除一条记录

function deleteItem()
{
    delete obj[1];//删除一个键值对
    delete obj[0]["sex"];//删除一条记录
}

上面的代码执行完后结果如下,删除一项
这里写图片描述
删除键值对
这里写图片描述

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值