本地存储：web应用在用户本地浏览器上存储更过的应用数据

一. 可以作为跨页面存储的技术有

1.cookie

2.localStorge/sessionStorage(web storage)

3.indexedDB

二. web storage

sessionStorage（临时存储）:为每个数据源维持一个存储区域，在浏览器打开期间存在，包括页面重新加载；localStorage(长期存储)与sessionStorage一样，但是浏览器关闭后，数据依然会一致存在

API:sessionStorage和localStorage的用户一致，引用类型的值要转成JSON 

三. 本地存储的作用

1.用户的会话信息(登录用户的登录信息，购物车数据)

2. 用户的个性化设置(如网站设置)

3.保存临时数据(如一些中间过程的数据)

4. 缓存(如缓存后端接口的数据，可以减少后端服务器的压力)

5. 记录分析用户行为

四. localStorage的特点

1. 单个域下5MB

2. 条数无限(只要容量够大)

3. 永不过期

4. 两个二级域名数据无法互通

五. localStorage和sessionStorage的区别

1. localStorage的生命周期是永久的，除非主动删除掉

2. sessionStorage的生命周期是会话周期，也就是说浏览器窗口关闭就会消失

3. 两者只是数据生命周期不同，其余使用方法一样

六. localStorage/sessionSorage的方法

1. setItem(key,value); 保存数据 写 增 没有return值

2. getItem(key); 读取数据 读 查 返回保存的数据，数据形式是字符串

3. removeItem(key); 删除数据 删 没有返回值

4. clear(); 清除所有 清空 没有返回值

七. 序列化和反序列化

序列化：JSON.Stringify(value);将引用类型的值转字符串

反序列化：JSON.parse(value);将字符串转为引用类型的值

注意：反序列化可能会抛出错误，用try...catch扑捉错误

例子：

const info = {name:'lee',age:20,id:'001'};
//存
localStorage.setItem('key',JSON.stringify(info));
session.Storage.setItem('key',JSON.stringify(info));
//取
try{
   JSON.parse(localStorage.getItem('key'));
   JSON.parse(localStorage.getItem('key'));
}catch{}

八. 使用localStorage需注意：

1. 单个域下最多存数5MB，如果空间满，继续存储将会失败，必须删掉一些东西才能继续保存；

2.浏览器的隐私模式下，localStorage不能读取到现有数据