JSON的简单使用_js、deal方法-CSDN博客

本文链接：https://blog.csdn.net/u014155400/article/details/48274593

JSON是JavaScript面向对象语法的一个子集，其全称为JavaScript Object Notation,是轻量级的数据交换格式。JSON是完全独立的语言，使用标准的语法来和其他编程语言进行数据交换。

一、使用JSON创建对象

JSON创建对象的格式十分简单，类似于java的map对象，语法为：var variable= { key : value}，因此，创建JSON对象十分简单。

JSON对象的访问也十分简单，可以使用variable.key进行访问，也可使用类似数组(variable[key])的方式进行访问。下面简单举个例子：

<script>
	function test(){
		var myJson = {
				"name":"张三",
				"age":20
		};
		alert("name:" + myJson.name + ",age:" + myJson.age);//使用variable.key访问
		alert("name:" + myJson["name"] + ",age:" + myJson["age"]);//使用variable[key]访问
	}
</script>

JSON是一种通用的字符串格式语言，在使用上有一些注意事项：对于一些特殊字符,例如双引号、反斜杠等需要使用转义字符"\"进行转义。

使用JSON创建数字类型没有特别的限制，JSON创建的数字支持整数、小数和科记数格式，如下所示<script>

    <script>
    function testNumber(){
        var json = {
                type1:12,
                type2:1.2,
                type3:1e2//科学记数法
        }
        alert(json.type1 + "," + json.type2 + "," + json.type3);
    }
</script>

JSON可以进行嵌套使用，如下所示：

<script>
function testNest(){
	var json = {
			name:"张三",
			age:20,
			address:{
				city:"上海",
				zipcode:"101010"
			}
	}
	alert("name:" + json.name + ",age:" + json.age + ",city:" + json.address.city + ",zipcode:" + json.address.zipcode);
	}
</script>

二、序列化和反序列化

序列化和反序列化需要引入json2.js文件，使用JSON.stringify(value,replacer,space)进行序列化，以下举例说明序列化参数的使用：

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>JSON的序列化</title>
</head>
<body οnlοad="serialize();">
	
</body>
<script src="js/json2.js" type="text/javascript"></script>
<script>
    function Person(name,age){
    	this.name = name;
    	this.age = age;
    }

	function serialize(){
		var person = new Person("张三",20);
		//使用JSON.stringify(value, replacer, space);其中第一个参数必选
		var personJson = JSON.stringify(person);
		alert(personJson);
		/* 当第一个参数为对象，第二个参数为数组时,并且数组中的值和第一个参数的属性相等时，此时，就以数组的值作为key,对象的值作为value进行序列化,
			如果数组中没有和对象中的元素的属性相同，则此时结果为{},
		*/
		var array = ["id","name"];//name和Person的name相同，因此结果为{name:'张三'}
		personJson = JSON.stringify(person, array);
		alert(personJson);
		array = ["id","address"];//array中的元素没有和Person中的元素的值相同，此时序列化的结果为{}
		personJson = JSON.stringify(person, array);
		alert(personJson);
		/*
		 当第一个参数和第二个参数都是数组的时候，这时候第二个参数被忽略，只有第一个参数被序列化
		*/
		var firstArray = ["张三","李四"];
		var json = JSON.stringify(firstArray, array);
		alert(json);
		/*
			当第二个参数为function,则把序列化后的每个对象传进方法中进行处理，
			第二个参数处理方法dealSerialize(key,value);此处的key值为"",vaule为第一个参数的对象
		*/
		personJson = JSON.stringify(person, dealSerialize);
		alert(personJson);
		/*
			第三个参数space：就是用什么来做分隔符的。 
		  　　如果省略的话，那么显示出来的值就没有分隔符，直接输出来 。
		  　  如果是一个数字的话，那么它就定义缩进几个字符，当然如果大于10 ，则默认为10，因为最大值为10。
		  　　如果是一些转义字符，比如“\t”，表示回车，那么它每行一个回车。 
		  　　如果仅仅是字符串，就在每行输出值的时候把这些字符串附加上去。当然，最大长度也是10个字符。 
		*/
		array=["name","age"];
		alert(JSON.stringify(person, array,5));
		alert(JSON.stringify(person, array,"\t"));//制表符
		alert(JSON.stringify(person, array,"test"));//在每一行上前加上字符串

	}
	function dealSerialize(key,value){
		return value.age +=1;//对年龄进行+1
	}
	
</script>
</html>

反序列化的使用：

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>parse的使用</title>
</head>
<body οnlοad="init();">

</body>
<script type="text/javascript" src="js/json2.js"></script>
<script>
	function init(){
		//此处的字符串变量必须使用''包含，并且key值必须使用""包含     
		var jsonString = '{"name":"zhangsan","age":20}';
		/*
		JSON.parse(text, reviver),字符串转换为JSON需要两个参数，第一个参数必须
		*/
		var json = JSON.parse(jsonString);
		alert(json.name + "," + json.age);
	/* 	reviver可选。 一个转换结果的函数。 将为对象的每个成员调用此函数。 如果成员包含嵌套对象，则先于父对象转换嵌套对象。 对于每个成员，会发生以下情况：
		如果 reviver 返回一个有效值，则成员值将替换为转换后的值。
		如果 reviver 返回它接收的相同值，则不修改成员值。
		如果 reviver 返回 null 或 undefined，则删除成员。 */
		json = JSON.parse(jsonString,dealReviver);
		alert(json.name + "," + json.age);
	}
	function dealReviver(key,value){
		if(typeof value == "number"){
			//return value + 1;//age + 1
			return null;//age赋值为null
		}else{
			return value;
		}
	}
</script>
</html>