关于JS中的JSON
早期,一般是使用XML作为互联网上传输结构化数据的,但由于它解析麻烦,字符冗长,因此被轻量级的JSON所逐渐替代。JSON是JavaScript的一个严格子集,利用了JavaScript中一些模式来表示结构化的数据。可以直接将JSON格式的字符串传递给eval()进行处理,由于JSON是JS的子集,eval后变成json对象,可以使用’.’操作符直接操作属性;
值得注意:JSON是一种数据格式,不是一种语言,虽然与JS中定义对象字面量的形式相似,但JSON不从属于JavaScript,因为其它语言(如:PHP,JSP)中也有针对JSON的解析和序列化的方法操作。
语法
JSON可以表示以下三种值:
- 简单值:如字符串、数值、布尔值和null,但不支持undefined
- 对象:对象作为一种复杂的数据类型,表示是一组无序的键值对儿,值可以是简单值也可以复杂的数据
- 数组:数组作为一种复杂的数据类型,表示是一组有序的列表儿,可以通过索引来获取引用的值,值可以是简单值,也可以复杂数据对象
一个简单的JSON示例:
{
"name": "Jack",
"age": 30,
"isMan": true,
"school": {
"name": "Lonton University",
"location": "English"
}
}
.csharpcode, .csharpcode pre
{
font-size: small;
color: black;
font-family: consolas, "Courier New", courier, monospace;
background-color: #ffffff;
/*white-space: pre;*/
}
.csharpcode pre { margin: 0em; }
.csharpcode .rem { color: #008000; }
.csharpcode .kwrd { color: #0000ff; }
.csharpcode .str { color: #006080; }
.csharpcode .op { color: #0000c0; }
.csharpcode .preproc { color: #cc6633; }
.csharpcode .asp { background-color: #ffff00; }
.csharpcode .html { color: #800000; }
.csharpcode .attr { color: #ff0000; }
.csharpcode .alt
{
background-color: #f4f4f4;
width: 100%;
margin: 0em;
}
.csharpcode .lnum { color: #606060; }
非常重要:JSON对象的属性(如上例中的“name”)必须加双引号。
在实际使用中,经常会因为上面使用单引号或不使用引号造成序死化错误,从而无法生成JSON对象
序列化
JSON被大家所认可,除了语法是JavaScript语法子集,更主要是可以直接eval序列化(但有一定风险,可能会执行一些恶意代码,如读cookie等)成可用的JS对象直接使用。ECMAScript 5对解析JSON进行规范,定义了全局对象JSON,支持的浏览器有:IE8+,Firefox 3.5+,Safari4+,Chrome和Opera 10.5+;
JSON对象提供两个方法:stringify()和parse(),stringify()是将JSON对象转成字符串,而parse()则是将符合规范的字符串转成可用JSON对象。
stringify()
JSON.stringify(value [, replacer] [, space])
value:JSON对象。
replacer:过滤器(可选的),可以是方法或数组,用于过滤操作,如果是数组,则序列化字符串只包含数组中指定的值的JSON属性及属性值,如果是方法,方法传递key,value,可以对JSON对象每一个属性值及值进行处理后返回。
space:是否保留缩进,默认不保留,并且删除所有换行。
1.如果省略的话,那么显示出来的值 就没有分隔符。直接输出来
2.如果是一个数字的话,那么它就定义缩进几个字符,当然 如果大于10 ,则最大值为10.
3.如果是一些转义字符,比如“\t”,表示回车,那么它每行一个回车。
4.如果仅仅是字符串,OK,就在每行输出值的时候把这些字符串附加上去就OK。当然,最大长度也是10个字符。
实例:
var student = new Object();
student.name = "Lanny";
student.age = "25";
student.location = "China";
var json = JSON.stringify(student);
alert(json); //{"name":"Lanny","age":"25","location":"China"}
.csharpcode, .csharpcode pre
{
font-size: small;
color: black;
font-family: consolas, "Courier New", courier, monospace;
background-color: #ffffff;
/*white-space: pre;*/
}
.csharpcode pre { margin: 0em; }
.csharpcode .rem { color: #008000; }
.csharpcode .kwrd { color: #0000ff; }
.csharpcode .str { color: #006080; }
.csharpcode .op { color: #0000c0; }
.csharpcode .preproc { color: #cc6633; }
.csharpcode .asp { background-color: #ffff00; }
.csharpcode .html { color: #800000; }
.csharpcode .attr { color: #ff0000; }
.csharpcode .alt
{
background-color: #f4f4f4;
width: 100%;
margin: 0em;
}
.csharpcode .lnum { color: #606060; }
使用数组过滤,只保留:name及locaiton
var json = JSON.stringify(student,["name","location"]);
alert(json);//{"name":"Lanny","location":"China"}
.csharpcode, .csharpcode pre
{
font-size: small;
color: black;
font-family: consolas, "Courier New", courier, monospace;
background-color: #ffffff;
/*white-space: pre;*/
}
.csharpcode pre { margin: 0em; }
.csharpcode .rem { color: #008000; }
.csharpcode .kwrd { color: #0000ff; }
.csharpcode .str { color: #006080; }
.csharpcode .op { color: #0000c0; }
.csharpcode .preproc { color: #cc6633; }
.csharpcode .asp { background-color: #ffff00; }
.csharpcode .html { color: #800000; }
.csharpcode .attr { color: #ff0000; }
.csharpcode .alt
{
background-color: #f4f4f4;
width: 100%;
margin: 0em;
}
.csharpcode .lnum { color: #606060; }
使用函数过滤,对于name属性值单独处理,在之前输出:”my name is :”
var json = JSON.stringify(student, function (key, value) {
switch (key){
case "name":
return "my name is " + value;
default :
return value;
}
});
alert(json);//{"name":"my name is Lanny","age":"25","location":"China"}
.csharpcode, .csharpcode pre
{
font-size: small;
color: black;
font-family: consolas, "Courier New", courier, monospace;
background-color: #ffffff;
/*white-space: pre;*/
}
.csharpcode pre { margin: 0em; }
.csharpcode .rem { color: #008000; }
.csharpcode .kwrd { color: #0000ff; }
.csharpcode .str { color: #006080; }
.csharpcode .op { color: #0000c0; }
.csharpcode .preproc { color: #cc6633; }
.csharpcode .asp { background-color: #ffff00; }
.csharpcode .html { color: #800000; }
.csharpcode .attr { color: #ff0000; }
.csharpcode .alt
{
background-color: #f4f4f4;
width: 100%;
margin: 0em;
}
.csharpcode .lnum { color: #606060; }
使用缩进,缩进4个空白:
var json = JSON.stringify(student,null,4);alert(json);//返回结果如下:{"name": "Lanny","age": "25","location": "China"}
.csharpcode, .csharpcode pre
{
font-size: small;
color: black;
font-family: consolas, "Courier New", courier, monospace;
background-color: #ffffff;
/*white-space: pre;*/
}
.csharpcode pre { margin: 0em; }
.csharpcode .rem { color: #008000; }
.csharpcode .kwrd { color: #0000ff; }
.csharpcode .str { color: #006080; }
.csharpcode .op { color: #0000c0; }
.csharpcode .preproc { color: #cc6633; }
.csharpcode .asp { background-color: #ffff00; }
.csharpcode .html { color: #800000; }
.csharpcode .attr { color: #ff0000; }
.csharpcode .alt
{
background-color: #f4f4f4;
width: 100%;
margin: 0em;
}
.csharpcode .lnum { color: #606060; }
parse()
JSON.parse(text [, reviver])
参数
text :必需。 一个有效的 JSON 字符串。
reviver :可选。 一个转换结果的函数。 将为对象的每个成员调用此函数。 如果成员包含嵌套对象,则先于父对象转换嵌套对象。 对于每个成员,会发生以下情况:
-
如果 reviver 返回一个有效值,则成员值将替换为转换后的值。
如果 reviver 返回它接收的相同值,则不修改成员值。
如果 reviver 返回 null 或 undefined,则删除成员。
返回值:一个对象或数组
示例:
var jsontext = '{"firstname":"Jesper","surname":"Aaberg","phone":["555-0100","555-0120"]}';
var contact = JSON.parse(jsontext);
.csharpcode, .csharpcode pre
{
font-size: small;
color: black;
font-family: consolas, "Courier New", courier, monospace;
background-color: #ffffff;
/*white-space: pre;*/
}
.csharpcode pre { margin: 0em; }
.csharpcode .rem { color: #008000; }
.csharpcode .kwrd { color: #0000ff; }
.csharpcode .str { color: #006080; }
.csharpcode .op { color: #0000c0; }
.csharpcode .preproc { color: #cc6633; }
.csharpcode .asp { background-color: #ffff00; }
.csharpcode .html { color: #800000; }
.csharpcode .attr { color: #ff0000; }
.csharpcode .alt
{
background-color: #f4f4f4;
width: 100%;
margin: 0em;
}
.csharpcode .lnum { color: #606060; }
以下示例演示了如何使用 JSON.stringify 将数组转换成 JSON 字符串,然后使用 JSON.parse 将该字符串还原成数组。
var arr = ["a", "b", "c"];
var str = JSON.stringify(arr);
document.write(str);
document.write ("<br/>");
var newArr = JSON.parse(str);
while (newArr.length > 0) {
document.write(newArr.pop() + "<br/>");
}
// Output:
var arr = ["a", "b", "c"];
var str = JSON.stringify(arr);
document.write(str);
document.write ("<br/>"); var newArr = JSON.parse(str); while (newArr.length > 0) {
document.write(newArr.pop() + "<br/>");
} // Output:
["a","b","c"]
c
b
a
.csharpcode, .csharpcode pre
{
font-size: small;
color: black;
font-family: consolas, "Courier New", courier, monospace;
background-color: #ffffff;
/*white-space: pre;*/
}
.csharpcode pre { margin: 0em; }
.csharpcode .rem { color: #008000; }
.csharpcode .kwrd { color: #0000ff; }
.csharpcode .str { color: #006080; }
.csharpcode .op { color: #0000c0; }
.csharpcode .preproc { color: #cc6633; }
.csharpcode .asp { background-color: #ffff00; }
.csharpcode .html { color: #800000; }
.csharpcode .attr { color: #ff0000; }
.csharpcode .alt
{
background-color: #f4f4f4;
width: 100%;
margin: 0em;
}
.csharpcode .lnum { color: #606060; }
关于JS中的JSON的更多相关文章
- MVC中处理Json和JS中处理Json对象
MVC中处理Json和JS中处理Json对象 ASP.NET MVC 很好的封装了Json,本文介绍MVC中处理Json和JS中处理Json对象,并提供详细的示例代码供参考. MVC中已经很好的封装了 ...
- js中的json对象详细介绍
JSON一种简单的数据格式,比xml更轻巧,在JavaScript中处理JSON数据不需要任何特殊的API或工具包,下面为大家详细介绍下js中的json对象, 1.JSON(JavaScript Ob ...
- 在js中使用json
在js中使用json var obj = { "1" : "value1", "2" : "value2" ...
- js中 给json对象添加属性和json数组添加元素
js中 给json对象添加新的属性 比如现在有一个json对象为jsonObj,需要给这个对象添加新的属性newParam,同时给newParam赋值为pre.做法如下: var obj={ &quo ...
- js中的json操作
js中的json操作 JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式,采用完全独立于语言的文本格式,是理想的数据交换格式.同时,JSON是 JavaScr ...
- 【转】MVC中处理Json和JS中处理Json对象
事实上,MVC中已经很好的封装了Json,让我们很方便的进行操作,而不像JS中那么复杂了. MVC中: public JsonResult Test() { JsonResult json = new ...
- js中把JSON字符串转换成JSON对象最好的方法
在JS中将JSON的字符串解析成JSON数据格式,一般有两种方式: 1.一种为使用eval()函数. 2. 使用Function对象来进行返回解析. 第一种解析方式:使用eval函数来解析,并且使用j ...
- Js中把JSON字符串转换为JSON对象(eval()、new Function())
在JS中将JSON的字符串解析成JSON数据格式,一般有两种方式: 1.一种为使用eval()函数. 2. 使用Function对象来进行返回解析. 第一种解析方式:使用eval函数来解析,并且使用j ...
- js 中读取JSON的方法探讨
方法一:函数构造定义法返回 var strJSON = "{name:'json name'}"; //得到的JSONvar obj = new Function("r ...
随机推荐
- C# 自动运行代码 (创建windows 服务的形式 )
本文转载自:http://blog.csdn.net/csethcrm/article/details/17917721 1. 新建项目 1.1 右键解决方案 – 添加 – 新建项目 1.2 ...
- AIX修改用户密码登录不成功案例分享
背景:使用passwd XXXX fcesjaif,修改新密码仍然提示密码不正确.拒绝登录 a. 使用命令lsuser -f XXXX |grep -i successful 查看不成功的次数 chu ...
- cppcheck 下载与安装(Liunx)
下载网址:https://sourceforge.net/projects/cppcheck/files/cppcheck/ 选择安装包:cppcheck-1.75.tar.gz 解压安装包:tar ...
- 关于DButils的简单介绍
android中的orm框架,一行代码就可以进行增删改查:支持事务,默认关闭:可通过注解自定义表名,列名,外键,唯一性约束,NOT NULL约束,CHECK约束等(需要混淆的时候请注解表名和列名)等等 ...
- node+mongodb+ionic+cordova
node + mongodb1,环境 windows 1,install nodejs 2,install npm | cd npmjs node cli.js install -gf1.1 2.no ...
- c# windows编程控件学习-2
using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; usin ...
- pads
1安装和破解,这个网上很多资料,破解的时候比较麻烦一点,注意安装环境. 2无模命令 (pads特点就是快捷键操作) 参考http://www.cnblogs.com/asus119/archive/2 ...
- Android Studio下SQLite数据库的配置与使用(完)
一,AS开发app用,所用的数据库有限制,必须使用较小的SQLite(MySql和Sql Server想想就不显示) 但是该数据库并不需要我们单独下载,安装的SDK中已经有了,在C:\AndroidS ...
- Oracle PL/SQL入门语法点
PL_SQL:带有分支和循环,面向过程匿名块:declare(可选,声明各种变量和游标的地方)begin(必要的,从此开始执行)exception(抓取到异常后执行的)end;[sql] view p ...
- ”isEqual“ ”isEqalToString“ 和“==”三者区别
isEqual :首先判断的时对象类型是否 一样,然后再判断具体内容是否一致:如果类型不一样,return no: isEqualToString: 直接判断字符串内容,便捷更快速,但是前提确保比较的 ...