Javascript(五十九)JSON对象

json数据传输格式：字符串的一种格式

xml数据传输格式：使用标签和属性形式存储，传的数据种类和数据量多

前端 传输 后端

数据结构 字符串（运输成本低，传输数据，无法传输结构） 数据结构

JSON对象：

前端方法：JSON.parse() json格式的字符串=>数据结构

​ JSON.stringfy() 数据结构=>json字符串
前后端交互流程：

1.通过ajax获取数据

2.分析数据，转成对应的数据结构

3.处理数据

$ajax.js :ajax函数封装

function queryString(obj){
				var str=''
				for(let key in obj){
					str+=key+'='+obj[key]+'&'
				}
				return str;
			}
			function $ajax({method='get',url,data,success,error}){
				if(data){
					/* 字符串转对象 */
					data=queryString(data)
				}
				/* 1.创建ajax对象 */
				/* 兼容性处理 */
				var xhr=null
				try{
					xhr=new XMLHttpRequest();
				}catch(error){
					xhr=new ActiveXObject('Microsoft.XMLHTTP')
				}
				/* 2.调用open */
				method=method.toLowerCase();
				if(method=='get'&&data){
					url+='?'+data
				}
				xhr.open(method,url,true);
				/* 3.调用send */
				if(method=='get'){
					xhr.send()
				}else{
					/*post 请求头格式 */
					xhr.setRequestHeader('content-type','application/x-www-form-urlencoded')
					xhr.send(data)
				}
				/* 4.等待请求数据响应 */
				xhr.onreadystatechange=function(){
					/* 判断响应数据是否请求完成 */
					if(xhr.readyState==4){
						if(xhr.status==200){
							/* 请求成功回调函数 */
							success(xhr.responseText)
						}else{
							/* 请求失败回调函数 */
							error(xhr.status)
						}
					}
				}
			}
	

向后端请求数据：数组

向后端请求数据：对象

格式化json数据：[在线JSON校验格式化工具（Be JSON）](https://www.bejson.com/)

将结构不清晰的json结构，转成可读性好的json数据

格式化之前：

格式化之后：

注：前端获取后端数据时，只有后端利用json_encode将数据结构转换成字符串，前端才能获取到

示例：新闻列表