在JSON之前使用XML传递数据，XML是一种纯文本格式，适合在网络上交换数据，但是XML格式比较复杂，解析困难；所以现在利用JSON轻量级的数据交换格式，更易于人阅读和编写，同时也易于机器解析和生成，并采用完全使JSON成为理想的数据交换语言。
前后端分离项目中，前端和后端进行数据交换格式大多数都是以JSON形式进行转换
5.1 JSON对象形式
//对象中包含若干属性，属性以“键值对”的形式书写。
//json数据格式语法：
let user = {
userId:1,
userName:'张三',
userSex:'男'
}
console.log(user.userId);
console.log(user.userName);
console.log(user.userSex);
5.2 JSON数组形式
//一个json数组中包含多个json对象。
let userArr = [
{
userId:1,
userName:'张三',
userSex:'男'
},{
userId:2,
userName:'李四',
userSex:'女'
},{
userId:3,
userName:'王五',
userSex:'男'
}
]
//获取json数组中某一个json对象
let user = userArr[0];
console.log(user.userId);
console.log(user.userName);
console.log(user.userSex);
//遍历json数组
for(let i=0;i<userArr.length;i++){
console.log(userArr[i].userId,userArr[i].userName,userArr[i].userSex);
}
5.3 JSON与字符串之间的转换
JavaScript中内置了一个JSON对象，可以用来进行json与字符串之间的转换
-
JSON转换成字符串：使用JSON.stringify( )
let user = {
userId:1,
userName:'张三',
userSex:'男'
}
let str = JSON.stringify(user);
console.log(str); //{"userId":1,"userName":"张三","userSex":"男"}
let userArr = [
{
userId:1,
userName:'张三',
userSex:'男'
},{
userId:2,
userName:'李四',
userSex:'女'
},{
userId:3,
userName:'王五',
userSex:'男'
}
]
let str = JSON.stringify(userArr);
console.log(str); //[{"userId":1,"userName":"张三","userSex":"男"}, ... ]
-
字符串转换成JSON：使用JSON.parse( )
let user = {
userId:1,
userName:'张三',
userSex:'男'
}
let str = JSON.stringify(user);
let new_user = JSON.parse(str);
console.log(new_user);
6.1 Web存储
在Web引用开发中，除了像数据库中永久保存数据之后，还需要数据的临时存储，所以可以将数据临时存储到客户端（客户端存储LocalStorage）或者服务器端（服务器端数据存储SessionStorage）
Web存储技术主要有：SessionStorage / LocalStorage / WebSQL / indexedDB / Cookies
-
SessionStorage
从打开一个浏览器窗口开始，到此浏览器窗口关闭结束，这个范围叫做session范围（会话范围）。SessionStorage 存储有效范围就是一个session范围。
当关闭浏览器后，再次打开浏览器中查看，就会发现SessionStorage中存储的数据已经没有了。那是因为，当浏览器关闭后，一个session会话范围就结束了，那么SessionStorage中的数据自然也就没有了。
SessionStorage 中有三个主要方法，能够进行数据的存储：
【1】setItem()： 该方法接受一个键和值作为参数，将会把键值对添加到存储中，如果键名存在，则更新其对应的值著作权归作者所有。
【2】 getItem()：该方法接受一个键名作为参数，返回键名对应的值。
【3】 removeItem()：该方法接受一个键名作为参数，并把该键名从存储中删除著作权归作者所有。
//向sessionStorage存入数据
sessionStorage.setItem('user','张三');
//从sessionStorage中取出数据
let str = sessionStorage.getItem('user');
console.log(str); //张三
-
LocalStorage
永久存储。只要不主动从LocalStorage中将数据移除，那么LocalStorage种的数据就始终存在。LocalStorage中的方法与SessionStorage 中的方法完全一样。
当关闭浏览器后，再次打开浏览器中查看，就会发现LocalStorage中存储的数据仍然还在。
//向localStorage存入数据
localStorage.setItem('user','张三');
//从localStorage中取出数据
let str = localStorage.getItem('user');
console.log(str); //张三
-
存储对象
SessionStorage 和LocalStorage中只能存储字符串数据。但有时我们可能需要存储对象，此时可以将对象转换为字符串进行存储，待取出时，再将字符串转换为对象。
let user = {
userId:1,
userName:'张三',
userSex:'男'
};
//将对象转换成字符串，进行存储
sessionStorage.setItem('user',JSON.stringify(user));
//将取出的字符串，转换成对象
let obj = JSON.parse(sessionStorage.getItem('user'));
console.log(obj);
