JS高级--本地存储

---本地存储 (JSON反序列化)

当web服务器向浏览器发送网页后，链接关闭，则会遗忘用户所有数据信息，想要记住用户信息就需要本地存储

----cookie    ---localStorage    ---sessionStorage

cookie : 93年出现，弊端：大小、数量受限制，默认情况下每一条数据会发送到服务器，针对cookie的缺陷，html5出现了localStorage和sessionStorage

localStorage（localStorage和sessionStorage属性、方法相同的）

localStorage：是一种没有时间限制的数据存储方式，关闭浏览器也不会消失，除非手动删除(永久生命周期)

sessionStorage： 阶段、会话：网页打开——网页关闭 （阶段生命周期）

localStorage的方法： 传入获取的值都是string查看本地数据长度

• 查看本地数据长度

localStorage.length在调试器的application中查看

• 添加（这两个都可以添加，选其中一个用即可）

localStorage.setItem("name","zhangsan");
localStorage.setItem("name","lisi");//只能添加一条，再添加就会覆盖之前的，比如lisi会覆盖zhangsan
  
localStorage.name="lisi";//也只能添加一条

　

let obj ={
   name:'zhangsan'
   password:123
}
let str = JSON.stringify(obj);//str{'name':'zhangsan'  'password':'123'}
localStorage.setItem('key',str)//key{'name':'zhangsan'  'password':'123'}

• 获取 (后台获取) 2种方法　

1.localStorage.getItem('key') //key{'name':'zhangsan'  'password':'123'}
let result = JSON.parse(localStorage.getItem('key'))
  //result={
   name:'zhangsan'
   password:123
  }
 2.localStorage.key

• 删除

 

localStorage.removeItem()

 

• 清空

localStorage.clear();