JSON(二)

一、补充说明

说明1：这部分主要是以练习为主，以需求为导向。

明确1：键是字符串的形式，而值可以是数组、对象(通常是)、number、null、boolean类型

二、JSON格式的字符串转化为JSON对象

需求1：JSON格式对象({})字符串转化为JSON对象--最简单的形式(值是单层的，不涉及嵌套)

                <script type="text/javascript">
			var json='{"name":"张三","age":23}';//JSON格式字符串(对象形式)转化为JSON对象
			alert(typeof json);
			var obj=JSON.parse(json);         //JS的内置对象---将字符串解析成JSON对象
			alert(typeof obj);
			alert(obj.name+"="+obj.age);
		</script>

说明：JSON格式的字符串要求特别严格，即最外层是{}，则此层元素必须是键值对的形式。

需求2：将JSON格式的字符串数组([])转化为JSON对象

<script type="text/javascript">
            //(1)JSON字符串的数组
	    var str='[{"name":"zhangsan","age":21},{"name":"lisi","age":20}]';
	    //(2)解析完后返回的是一个数组,数组元素是JSON对象
            var v=JSON.parse(str);
            //(3)for in 循环通过角标取出JSON对象
            for(i in v){
            	alert(v[i].name+":"+v[i].age);
            }
</script>

说明：这里我显示的通过键名来获取值，并且采用了for in的循环模式。

注意：for in的出现本来是为了JSON对象，明确数组和JSON对象使用时i的含义。

需求3：将数组(非JSON)的字符串转化为JSON对象

<script type="text/javascript">
		//说明：数组的字符串
		var str2='["zhangsan","lisi"]';
		//返回一个数组(对象)，数组元素是字符串
		var obj=JSON.parse(str2);
		//通过角标索引直接取
		alert(obj[0]+":"+obj[1]);//可以循环获取
		</script>

说明：数组中的元素可以是对象(json形式)、number、boolean、null等。

需求4：将深层次结构的JSON对象(最外层{})的字符串转化为JSON对象

<script type="text/javascript">
					
	var str = '{"username": "zhansan","age": 23,"test": [{"chinese": 100,"math": 80},{"physical": 90,"english": 70}]}';
	var obj=JSON.parse(str);//字符串转换成JSON对象
        //获取数据
	for(key in obj){//获取JSON的每个键---JSON对象独有的遍历方式
		var temp=obj[key];//获取当前的值对象--如果是string类型的，直接就可以输出
		if((typeof temp)=="object"){        //关键(表示仍然还有层级关系)
			for(j in temp){             //temp表示JSON数组(对象)，用索引
				var temp1=temp[j];  //只有通过索引才能获取数组中的内容
				for(k in temp1){    //数组里面的每个元素是JSON对象
					alert(k+":"+temp1[k]);
				}
			}
		}else{
			//单层遍历
			alert(key+":"+temp);
		}
	}
	//说明：在数据流传输流程中，json是文本，即以字符串的形式传递的，而JS操作的是JSON对象,JSON对象和JSON字符串之间的转换是关键	
</script>

说明：好好体会，里面的信息很丰富

--------------------------------------------------------------------

三、JSON对象转化为JSON字符串

需求1：将上面的"JS对象"封装的数据转成"JSON字符串

var student={
	"name":"Jane",
	"age":"25",
        "location":"China"
	}
var str=JSON.stringify(student);//注意是这个方法
document.write(str);
//结果如下：{"name":"Lanny","age":"25","location":"China"}

需求2：将一个数组对象(关联数组)转成JSON字符串

var students = new Array() ; 
		students[0] = "Lanny"; 
		students[1] = "dong"; //里面也可以换成其他形式的内容
		students[2] = "I love you"; 
		var str=JSON.stringify(students);
		document.write(str)
		//結果如下：["Lanny","dong","I love you"]

说明：

需求3：JS解析JSON对象(循环)

<script type="text/javascript">
	var packJson = {
		"name": "Liza",
		"password": "123"
	};
	 //遍历packJson 对象的每个key/value对,k为key 
	for (var k in packJson) { 
		alert(k+" " +packJson[k]);
	}
</script>

需求4：解析JSON数组对象

            <script type="text/javascript">
			var packJson = [{
				"name": "Liza",
				"password": "123"
			}, {
				"name": "Mike",
				"password": "456"
			}];
			//说明；for in循环是专注为JSON，也可以使用数组
			for (var i in packJson) {    //遍历数组[]时，i为索引  
				var temp=packJson[i];//获取第一个数组元素是JSON对象
				for(j in temp){      //遍历JSON对象
					alert(j+":"+temp[j]);
				}
				//alert(packJson[i].name + " " + packJson[i].password);//通过JSON对象的字段的这种方式也可获取值
			}
	    </script>

需求5：Jquery将JSON字符串转换成JSON对象

            <script type="text/javascript">
			$(function(){
			var str='[{"name":"zhangsan","age":21},{"name":"lisi","age":20}]';
			var obj=$.parseJSON(str);
			alert(obj[0].name);
			});
		</script>

未完待续。。。

猜你喜欢