JSON(JavaScript Object Notation 对象标记) 是一种轻量级的数据交换格式,采用完全独立于语言的文本格式,是理想的数据交换格式。同时,JSON是 JavaScript 原生格式,这意味着在 JavaScript 中处理 JSON数据不须要任何特殊的 API 或工具包。
 
本文主要是对JS操作JSON的要领做下总结。

参看本文时,可以参看我整理的另一片文章:Javascript 中使用Json的四种途径

一. 结构

 在JSON中,有两种结构:对象和数组。

1. 对象

  一个对象以“{”(左括号)开始,“}”(右括号)结束。每个“名称”后跟一个“:”(冒号);“‘名称/值’ 对”之间运用 “,”(逗号)分隔。 名称用引号括起来;值如果是字符串则必须用括号,数值型则不须要。例如:

var o={"xlid":"cxh","xldigitid":123456,"topscore":2000,"topplaytime":"2009-08-20"};

2. 数组

 数组值(value)的有序集合。一个数组以“[”(左中括号)开始,“]”(右中括号)结束。值之间运用 “,”(逗号)分隔。

例如:

var jsonranklist=[{"xlid":"cxh","xldigitid":123456,"topscore":2000,"topplaytime":"2009-08-20"},{"xlid":"zd","xldigitid":123456,"topscore":1500,"topplaytime":"2009-11-20"}];

二. js操作

为了方便地处理JSON数据,JSON提供了json.js包,下载地址:http://www.json.org/

在数据传输流程中,json是以文本,即字符串的形式传递的,而JS操作的是JSON对象,所以,JSON对象和JSON字符串之间的相互转换是关键。例如:

 JSON字符串:

    var str1 = '{ "name": "cxh", "sex": "man" }';

    JSON对象:

    var str2 = { "name": "cxh", "sex": "man" };

1. JSON字符串转换为JSON对象

要运用上面的str1,必须运用下面的要领先转化为JSON对象:

    var obj = eval('(' + str + ')');//不太安全

 或者

    var obj = str.parseJSON(); //由JSON字符串转换为JSON对象

    或者

    var obj = JSON.parse(str); //由JSON字符串转换为JSON对象,浏览器兼容性有问题,建议引入json.js

然后,就可以这样读取:

Alert(obj.name);

Alert(obj.sex);

特别留心:如果obj本来就是一个JSON对象,那么运用 eval()函数转换后(哪怕是多次转换)还是JSON对象,但是运用 parseJSON()函数处理后会有疑问(抛出语法异常)。

 2. JSON对象转化为JSON字符串

可以运用 toJSONString()或者全局要领 JSON.stringify()将JSON对象转化为JSON字符串。

例如:

    var last=obj.toJSONString(); //将JSON对象转化为JSON字符

    或者

    var last=JSON.stringify(obj); //将JSON对象转化为JSON字符,浏览器兼容性有问题,建议引入json.js

    alert(last);

留心:

上面的多个要领中,除了eval()函数是js自带的之外,其他的多个要领都来自json.js包。新版本的 JSON 修改了 API,将 JSON.stringify() 和 JSON.parse() 两个要领都注入到了 Javascript 的内建对象里面,前者变成了 Object.toJSONString(),而后者变成了 String.parseJSON()。如果提示找不到toJSONString()和parseJSON()要领,则说明您的json包版本太低。

 3. JSON字符串格式化输出

stringify还有个可选参数space(1<=space<=10),可以指定缩进的空格数,用于美化输出;

  JSON.stringify(value[, replacer [, space]]);

  例如: JSON.stringify(jsonStr, undefined, 2);    

4. JSON字符串数组的遍历  

  var jsonStr = [{"name" : "xiaoming", "password" : "111111"},{"name" : "zhangsan", "password" : "222222"}];

  for(var i in jsonStr){

    console.log( jsonStr[i].name + ":" + jsonStr[i].password);

  }

5. json字符串取值

    var jsonStr = {"name" : "ke", "nickname" : "ken", "img" : "images/1.jpg"};

  json串取值: console.log(jsonStr["name"]);

  json对象取值: console.log(jsonStr.name);

6. 删除指定元素

delete jsonStr["name"];

delete jsonStr.name;

JavaScript中使用JSON,即JS操作JSON总结的更多相关文章

  1. JSON基础 JS操作JSON总结

    JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式,采用完全独立于语言的文本格式,是理想的数据交换格式.同时,JSON是 JavaScript 原生格式,这意 ...

  2. JavaScript(js)对象常用操作,JS操作JSON总结

    数据类型判断可以通过一元操作符typeof,此操作符可以判断大部分JS数据类型. 也可以通过instanceof来判断.如: var a = []; alert(typeof a); // objec ...

  3. JS操作JSON总结

    JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式,采用完全独立于语言的文本格式,是理想的数据交换格式.同时,JSON是 JavaScript 原生格式,这意 ...

  4. (转)JSON数据格式和js操作json总结

    原:http://niutuku.com/tech/javaScript/273643.shtml JSON数据格式和js操作json总结 来源:niutuku.com |         vince ...

  5. JS操作JSON总结(转)

    JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式,采用完全独立于语言的文本格式,是理想的数据交换格式.同时,JSON是 JavaScript 原生格式,这意 ...

  6. JS操作JSON的方法总结

    JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式,采用完全独立于语言的文本格式,是理想的数据交换格式.同时,JSON是 JavaScript 原生格式,这意 ...

  7. javascript、js操作json方法总结(json字符创转换json对象)

    相信前端的同学们对json并不陌生,接触过很多.但是很少人知道json的全称是什么,哈哈,我也是查资 料知道的.(JSON JavaScript Object Notation是一种轻量级的数据交换格 ...

  8. javascript、js操作json对象和字符串互相转换方法

    相信前端的同学们对json并不陌生,接触过很多.但是很少人知道json的全称是什么,哈哈,我也是查资料知道的.(JSON JavaScript Object Notation是一种轻量级的数据交换格式 ...

  9. JS 操作JSON字符串

    用Js的eval解析JSON中的注意点 在JS中将JSON的字符串解析成JSON数据格式,一般有两种方式: 1.一种为使用eval()函数. 2. 使用Function对象来进行返回解析. 使用eva ...

随机推荐

  1. java阶乘问题

    问题描述: 编写代码求:1!+2!+3!+…+20!的值 代码 public class Demo { public static void main(String[] args) { long nu ...

  2. (转载)JavaScript中匿名函数,函数直接量和闭包

    首先,我们先看看下面几种写法:1.function f(x){return x*x;};f(x);2.(function(x){return x*x;})(x);3.(function(x){retu ...

  3. fedora19/opensuse13.1 配置openvpn client

    Date: 20140207Auth: Jin 1.install # yum -y install openvpn #zypper install openvpn 2.copy user key # ...

  4. 项目中集成Easyui-Tree,可拖拽更新节点

    由于公司架构较旧,使用的jdk版本为1.4,页面上也没有el表达式. Html <ul class="easyui-tree" id="data"> ...

  5. iOS:Reachability网络监听

    iOS利用Reachability确认网络环境3G/WIFI 开发Web等网络应用程序的时候,需要确认网络环境,连接情况等信息.如果没有处理它们,是不会通过Apple的审查的,一般情况下,可以把网络监 ...

  6. c/c++在windows下获取时间和计算时间差的几种方法总结 【转】

    http://blog.csdn.net/coder_xia/article/details/6566708 一.标准C和C++都可用 1.获取时间用time_t time( time_t * tim ...

  7. 一步一步学RenderMonkey(5)--渲染到纹理(RTT) 【转】

    转载请注明出处:  http://blog.csdn.net/tianhai110 渲染到纹理: 新建一个空effect; 添加渲染目标纹理, Add Texture-> Add Render ...

  8. Vue使用中遇到问题汇总(一)32个

    1.安装一些需要编译的包:提示没有安装python.build失败等 因为一些 npm 的包安装需要编译的环境,mac 和 linux 都还好,大多都齐全 .window 用户依赖 visual st ...

  9. Maven nexus 安装nexus私服出现的两个问题

    1. 在win10中安装nexus时提示:wrapper | OpenSCManager failed - 拒绝访问. (0x5) 主要是没有权限.需要以管理员的身份运行 如果你是直接点击 start ...

  10. 解决NoClassDefFoundError: javax/servlet/jsp/jstl/core/Config

    使用spring3.05 mvc进行开发,使用tomcat容器,通过url映射寻找view的时候,会报错NoClassDefFoundError: javax/servlet/jsp/jstl/cor ...