JS的ajax操作
ajax操作---向后端处理程序发送http请求,得到响应结果
---与后端处理程序数据交换。json数据格式
A.为什么在学习ajax操作之前学习json数据格式?
一般情况下后端处理程序不会识别javascript对象,前端处理程序往往会是不会识别后端处理程序返回的数据对象。
此时我们需要一种数据格式能够被后端处理程序和前端处理程序都识别--json数据格式
B.什么是 JSON ?
JSON--JavaScript对象表示法【JavaScript Object Notation】
脱离编程语言的进行数据交换的文本【字符串】数据格式
在没有JSON之前我们使用XML充当数据交换格式。
C.JSON数据的组成----文本【字符串】
1.json对象
a.“{}”--json对象的字符串表示
b.“{}”包含的是--【键值对】
键---使用双引号包围
值---数字,字符串【双引号包围】,
逻辑值,json数组【使用[]】,
JSON对象【使用{}】,null
例如:使用json对象的字符串表示方式表示一个学生基本信息
"{\"stuid\":\"1001\",
\"stuname\":\"张三\",
\"stuage\":23,
\"stuaddress\":[{\"type\":\"家庭\",\"info\":\"长安南路\"},
{\"type\":\"学校\",\"info\":\"高新一中\"}]}"
2.json数组
“[]”--json数组
“[]”包含---具体数据值/json对象
例如:使用json数组表示一个学生的兴趣安好
"{\"stuid\":\"1001\",
\"stuname\":\"张三\",
\"stuage\":23,
\"stulike\":[\"游泳\",\"下棋\",\"画画\"]}"
使用json数组表示一个学生的地址信息
"{\"stuid\":\"1001\",
\"stuname\":\"张三\",
\"stuage\":23,
\"stuaddress\":[{\"type\":\"家庭\",\"info\":\"长安南路\"},
{\"type\":\"学校\",\"info\":\"高新一中\"}]}"
"[
{\"stuid\":\"1001\",
\"stuname\":\"张三\",
\"stuage\":23,
\"stuaddress\":[{\"type\":\"家庭\",\"info\":\"长安南路\"},
{\"type\":\"学校\",\"info\":\"高新一中\"}]},
{\"stuid\":\"1002\",
\"stuname\":\"李四\",
\"stuage\":24,
\"stuaddress\":[{\"type\":\"家庭\",\"info\":\"长安南路\"},
{\"type\":\"学校\",\"info\":\"高新一中\"}]},
]"
比较复杂的json数据都是对象中有数组,数组中有对象的嵌套结构
https://free-api.heweather.com/v5/weather?city=%E8%A5%BF%E5%AE%89&key=d7bd43af19c64994b62fc643e5d75272
面对上面的复杂json数据,我们往往不能看清他的结构,这时我们可以借助工具来查看json的结构
https://www.json.cn/
D.JSON数据的转换
我们得到的json数据有可能是json对象,也有可能是json字符串。因此我们就需要将json对象与json字符串进行转换。
1.判断得到的是json对象还是json字符串。
var stustring="[{\"stuid\":\"1001\",\"stuname\":\"张三\",\"stuage\":23,\"stuaddress\":[{\"type\":\"家庭\",\"info\":\"长安南路\"},{\"type\":\"学校\",\"info\":\"高新一中\"}]},"+
"{\"stuid\":\"1002\",\"stuname\":\"李四\",\"stuage\":24,\"stuaddress\":[{\"type\":\"家庭\",\"info\":\"长安南路\"},{\"type\":\"学校\",\"info\":\"高新一中\"}]}]";
alert(typeof stustring); //string
var stuobj={stuid:"1001",stuname:"张三"};
alert(typeof stuobj); //object
json对象的字符串---->json对象[javascript对象]
a.使用 JSON.parse() 方法将数据转换为 JavaScript 对象。
b.eval("("+str+")");
//json对象的字符串---->json对象[javascript对象]
//var stustring="[{\"stuid\":\"1001\",\"stuname\":\"张三\",\"stuage\":23,\"stuaddress\":[{\"type\":\"家庭\",\"info\":\"长安南路\"},{\"type\":\"学校\",\"info\":\"高新一中\"}]},"+
// "{\"stuid\":\"1002\",\"stuname\":\"李四\",\"stuage\":24,\"stuaddress\":[{\"type\":\"家庭\",\"info\":\"长安南路\"},{\"type\":\"学校\",\"info\":\"高新一中\"}]}]";
//alert(typeof stustring); //string
//1.使用 JSON.parse() 方法将数据转换为 JavaScript 对象。
//var stuobj=JSON.parse(stustring);
//alert(typeof stuobj); //object
//alert(stuobj[1].stuname);
//2.eval("("+str+")");
//var stuobj=eval("("+stustring+")");
//alert(typeof stuobj); //object
//alert(stuobj[0].stuaddress[0].info+","+stuobj[0].stuaddress[1].info);
json对象[javascript对象]--->json对象的字符串
可以使用 JSON.stringify() 方法将 JavaScript 对象转换为字符串。
//可以使用 JSON.stringify() 方法将 JavaScript 对象转换为字符串。
var stuobj={stuid:"1001",stuname:"张三"};
//alert(typeof stuobj); //object
var stustring=JSON.stringify(stuobj);
alert(typeof stustring); //string
alert(stustring);