JS JSON

标签：javascript   xml   json   

学了JS这么久，终于碰到了一个没听说过的东西-JSON。但是它又不是完全陌生的，和之前的知识联系得也很紧密。 下面且听我一一道来。

一、由来

学此知识点应有XLM基础，我们都知道，XML，优势非常多，但开发人员还是觉得这种微型的数据结构还是过于繁琐、冗长。由此，为了解决这个问题，JSON的结构化数据出现了。

二、语法

JSON和XML类型，都是一种结构化的数据表示方式。JSON的语法可以表示三种类型的值，分别是简单值、对象和数组。

1、简单值

100、"Lee"这两个量就是JSON的表示方法，一个是JSON数值，一个是JSON字符串。布尔值和null也是有效的形式。

2、对象

我们与JavaScript对象字面量进行比较。

JavaScript对象字面量表示法：

var box={
       name:"Lee";
       age:100
};

{
       "name":"Lee",           
       "age":100
}

同上比较来进行学习

JavaScript数组字面量表示法：

var box=[100,'Lee',true];

[100,"Lee",true]

拓展：

一般情况下，我们可以把JSON结构数据保存到一个文本文件里。

模拟加载JSON文本文件的数据，并且赋值给变量：

var box='[{"name":"a","age":1},{"name":"b","age":2}]';

三、解析

早期采用的是eval()函数，但这种方法即不安全，可能会执行一些恶意代码。所以ECMAScript5对解析JSON的行为进行桂发，定义了全局对象JSON。那么我们就要考虑浏览器兼容性的问题了。这个完全没有必要担心，不支持的浏览器可以通过一个开源库json.js来模拟执行。那具体是怎样解析的呢？

JSON对象提供了两个方法，一个是将原生JavaScript值转为JSON字符串：stringfy()；另一个是将JSON字符串转换为JavaScript原生值：parse()。

例子：

1、parse()

var box='[{"name":"a","age":1},{"name":"b","age":2}]';   
var json=JSON.parse(box);
alert(json);

2、stringfy()

var box=[{name:'a',age:1},{name:'b',age:2}];        
var json=JSON.stringify(box);
alert(json);

以上面为基础，序列化JSON的过程中，stringify()方法还提供了二个参数，第一个参数可以是一个数组，也可以是一个函数，用于过滤结果。第二个参数表示是否在JSON字符串中保留缩进。如果不需要保留缩进，不填即可。如果不需要过滤结果，但又要保留缩进，则将过滤结果的参数设置为null。

例子：

1、参数为数组

var box=[{name:'a',age:1,height:177},{name:'b',age:2,height:188}];
var json=JSON.stringify(box,['name','age'],4);
alert(json);

var box=[{name:'a',age:1,height:177},{name:'b',age:2,height:188}];
var json=JSON.stringify(box,function(key,value){
	switch(key){
		case 'name':
			return 'Mr.'+value;
		case 'age':
			return value+'岁';
		default:
			return value;;
	}
},4);
alert(json);

3、toJSON()方法

var box=[{name:'a',age:1,height:177,toJSON:function(){
	return this.name;	
}},{name:'b',age:2,height:188,toJSON:function(){
	return this.name;
}}];
var json=JSON.stringify(box);
alert(json);

小结：

         知识里所谓的新旧知识是有联系的，在学习新的知识的时候与旧的知识相结合，会组建起一张记忆深刻的知识网。比较中学习更有利于知识的消化和吸收。JSON，你懂了吗？

JS JSON

标签：javascript   xml   json   

原文地址：http://blog.csdn.net/qwlzxx/article/details/47184461