JavaScript对json操作小记
JSON是一种轻量级的数据交换格式,同时,JSON是 JavaScript 原生格式,因此我们可以直接处理它不需要依赖任何工具包或者插件。因此,好多后台都会选择返回给前端这种非常友好的数据格式。
引子:
这篇文章是由刚刚开发过程中遇到的一个小问题引发的,先重现一下问题:
var name=$('.wrap').find('.item-name').html();
ssJson[name]=id+'_'+num+'_'+buyUsdt;
// ssJson.name=id+'_'+num+'_'+buyUsdt;
这段代码,要给ssJson这个json对象,以一个变量name为键名添加一个元素进去,使用第三行代码实现不了原本想要达到的效果。因为‘.’这个操作符,在JavaScript中有着特殊意义,用在这里,它就表示对象中键名为“name”的元素,而不是取变量name的值作为键名。之所以会犯这个错误,完全是因为自己对json操作太陌生。因此,决定总结下json操作,不足之处,请多指教!
目前而言,我只知道json对象在JavaScript中有两种操作方式:
Json[prop]=value;
Json.prop=value;
这两个操作方式有什么区别呢?举个例子先:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<script>
var jsonObj={
'one':'1',
'two':'2',
'three':'3'
};
var key1='one';
console.log(jsonObj.one);
console.log(jsonObj[key1]);
console.log(jsonObj[one]);
</script>
</body>
</html>
这是输出结果:

由此可见,中括号里面放的应该是变量,而'.'后面,应该直接跟键名。如果键名固定的话,我们使用两种方式都可以操作json,如果键名是变量那么我们就只能乖乖使用中括号形式的方式来操作了。好了,这个小问题就先说到这里。下面来说说其他json操作方法,既然吃一堑,就要长一智。O(∩_∩)O哈哈~
JavaScript中的json形式
JavaScript中的json有两种表现形式,一种是单个的json对象,另一种是json数组,就是多个json对象组成的数组,只要会处理基本的json对象,json数组也能够融会贯通了。
json对象:
var jsonObj={
'one':'1',
'two':'2',
'three':'3'
};
json数组:
var jsonArr = [
{
'one': '1'
},
{
'two': '2'
},
{
'three': '3'
}
];
json的取值
每个json对象都是有键值和键名一一对应的元素组成,无论是键值还是键名都可以操作。
json对象的遍历:
//遍历json对象
for(var key in jsonObj){
console.log(key+':'+jsonObj[key]);
}
json数组的遍历:
//遍历json数组
for(var i in jsonArr){
console.log(jsonArr[i]);
for(var key in jsonObj){
console.log(key+':'+jsonObj[key]);
}
}
结果如下:

json增删改查
查的话无非就是遍历,这里就不在赘述。增加和修改又极为相似,因此这里只说说删除和修改。
删除:
//删除json对象中的元素,初步思路是,找到要删除的元素,然后按照某种规则转化成字符串,删除对应串后再转回去,代码后面再补充
function deleteItem(jsonObj,key) {
for(var key in jsonObj) {
if(jsonObj[key] == key) {
jsonObj[key] = '';
}
}
}
修改:
function updateItem(jsonObj,key,keyVal) {
// jsonObj为要操作的json对象
// key为要操作的元素的键名
// key为要操作的元素的新值
for(var key in jsonObj) {
if(jsonObj[key] == key) {
jsonObj[key] = keyVal;
}
}
}
我理解的json操作,目前大概只有这么多,欢迎大家补充!祝你们周末愉快。(*╹▽╹*)
JavaScript对json操作小记的更多相关文章
- Json数组操作小记 及 JSON对象和字符串之间的相互转换
[{"productid":"1","sortindex":"2"},{"productid":&q ...
- Json操作(DynamicJson)
Json的简介 JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式.它基于ECMAScript的一个子集. JSON采用完全独立于语言的文本格式,但是也使用了 ...
- 第一百二十七节,JavaScript,JSON数据类型转换,数据转换成字符串,字符串转换成数据
第一百二十七节,JavaScript,JSON数据类型转换,数据转换成字符串,字符串转换成数据 学习要点: 1.JSON语法 2.解析和序列化 前两章我们探讨了XML的结构化数据,但开发人员还是觉得这 ...
- 【转】python 历险记(四)— python 中常用的 json 操作
[转]python 历险记(四)— python 中常用的 json 操作 目录 引言 基础知识 什么是 JSON? JSON 的语法 JSON 对象有哪些特点? JSON 数组有哪些特点? 什么是编 ...
- javaScript系列 [05]-javaScript和JSON
本文输出和JSON有关的以下内容❐ JSON和javaScript❐ JSON的语法介绍❐ JSON的数据类型❐ JSON和XMLHTTPRequest❐ JSON的序列化和反序列化处理 1.1 JS ...
- python 历险记(四)— python 中常用的 json 操作
目录 引言 基础知识 什么是 JSON? JSON 的语法 JSON 对象有哪些特点? JSON 数组有哪些特点? 什么是编码和解码? 常用的 json 操作有哪些? json 操作需要什么库? 如何 ...
- Python之路day13 web 前端(JavaScript,DOM操作)
参考链接:http://www.cnblogs.com/wupeiqi/articles/5433893.html day13 1. CSS示例 2. JavaScript 3. DOM操作 上节内容 ...
- javascript删除JSON元素
首先要搞清JSON的数据格式,我这里所说的JSON都是指javascript中的. JSON数据是由对象和数组数据结构组成,我们只要学会javascript中对对象和数组的删除方法即可对JSON项进行 ...
- (转载)JavaScript递归查询 json 树 父子节点
在Json中知道某个属性名,想要确定该属性在Json树具体的节点,然后进行操作还是很麻烦的 可以用以下方法找到该属性所在的节点,和父节点 <!DOCTYPE html> <html ...
随机推荐
- OJ题:成绩排序
题目描述 查找和排序 题目:输入任意(用户,成绩)序列,可以获得成绩从高到低或从低到高的排列,相同成绩 都按先录入排列在前的规则处理. 例示: jack 70 peter 96 Tom 70 smit ...
- 9.2、Libgdx的输入处理之鼠标、触摸和键盘
(官网:www.libgdx.cn) Libgdx支持的最主要的设备是desktop或浏览器的鼠标支持,Android的触摸屏支持和键盘的支持.我们接下来了解一下. 键盘 用户按下或释放一个按键生成了 ...
- (五十一)KVC与KVO详解
KVC的全称为key value coding,它是一种使用字符串间接更改对象属性的方法. 假设有一个Person类和一个Student类,其中Person类有age.name两个属性,Student ...
- 数据结构基础(21) --DFS与BFS
DFS 从图中某个顶点V0 出发,访问此顶点,然后依次从V0的各个未被访问的邻接点出发深度优先搜索遍历图,直至图中所有和V0有路径相通的顶点都被访问到(使用堆栈). //使用邻接矩阵存储的无向图的深度 ...
- R12 - Error 'Unable to process your transaction. The operating unit is either invalid or it cannot b
In this Document Symptoms Cause Solution Still Have Questions? References APPLIES TO: Orac ...
- 【一天一道LeetCode】#43. Multiply Strings
一天一道LeetCode系列 (一)题目 Given two numbers represented as strings, return multiplication of the numbers ...
- 《java入门第一季》之Arrays类前传(排序问题)
一:冒泡排序 /* * 数组排序之冒泡排序: * 相邻元素两两比较,大的往后放,第一次完毕,最大值出现在了最大索引处 * * 引申: * 利用冒泡排序法,可以获取一个数组的最大值(先冒泡排序,取最后一 ...
- 《Oracle Applications DBA 基础》- 9 - Concurrent Processing
来自:http://www.itpub.net/thread-1411293-1-4.html <Oracle Applications DBA 基础>- 9 - Concurrent P ...
- Java进阶(九)正则表达式
java正则表达式 序 由于项目中使用到了利用正则表达式进行表单的校验,回想一下正则表达式的内容,忘得也差不多了,俗话说:"温故而知新,可以为师矣".今天就简单的温故一下正则表达式 ...
- rhel6.4 安装nodejs和Mysql DB服务
rhel6.4 安装nodejs和Mysql DB服务 安装好redhat6.4虚拟机后, 安装软件: # yum install gcc-c++ openssl-devel Loaded plugi ...