文章目录
JSON
一、JSON介绍
json格式的文本,是所有编程语言都能识别的,在所有编程语言中都是同一个语法格式
元素的值可以是number,string(双引号),null,bollean,array,obj
json格式的文件主要用于前后端交互来传递数据。
为什么使用json格式传递数据?
- json格式体积小,一般把json叫做轻量级的数据交换格式(早期使用XML格式)
- 所有语言都能识别json格式
- 便于解析
{
"name":"lucy",
"age":12,
"like":["sleep","eat"],
"vip":false,
"family":{
"mother":"韩梅梅",
"father":"李雷",
"pet":"dog"
},
"sister":null
}
二、JSON的两个方法
1. 把js的对象或数组转化为json字符串
语法:JSON.stringify(js对象或数组)
返回值:json字符串
const data = {
"name":"lucy",
"age":12,
"vip":false,
};
const jsonStr = JSON.stringify(data);
console.log(jsonStr);
2. 把接收到的后端的json字符串转换成js对象或数组
语法:JSON.parse(json字符串)
返回值:js对象或数组
const jsonStr = '{"name":"lucy"}';
const data = JSON.parse(jsonStr);
console.log(data)
本地存储和会话存储
本地存储 localStorage 和会话存储 sessionStorage 是浏览器里面的一个存储空间,
同一个域名下的不同页面可以共享同一个存储空间。
如:
同是file:// 开头的文件可以共享一个存储空间,
同是http://127.0.0.1:xxxx/ 开头的文件可以同享一个存储空间
一、区别
本地存储会一直存储在浏览器中,除非手动删除
会话存储只要关闭浏览器,就会被浏览器自动删除
它们的操作方法是一样的,只是存在的时间不同
console.log(localStorage);
console.log(sessionStorage);
二、操作本地存储、会话存储的方式
1. 所有操作对象的方式都适用
// 增加
localStorage.name = "lucy";
// 删除
delete localStorage.name;
// 修改(重新赋值)
localStorage.name = "poly";
// 查询
console.log(localStorage.name);
// 注意:存储到本地存储键和值都必须是字符串格式,如果不是,会强制转换
localStorage.like = {name:"lucy",age:12};
localStorage.family = ["小张","小李"]
// 如果一定要存储对象和数组,可转换为json字符串再存储
localStorage.like = JSON.stringify({name:"lucy",age:12});
localStorage.family = JSON.stringify(["小张","小李"]);
2. 现成操作存储的api
// 新增:localStorage.setItem(key,value)
localStorage.setItem("age",12);
// 删除: localStorage.removeItem(key)
localStorage.removeItem("name");
// 新增一个相同的key就是修改
localStorage.setItem("age",18);
// 获取:localStorage.getItem(key)
console.log(localStorage.getItem("like"))
// 清空:localStorage.clear()
注意:
- 键和值都是字符串,如果传入的不是字符串,会被强制转换
- 同源下的本地存储内容可以共享
- 同源下的键是唯一的