浅谈loccalStorage，sessionStorage与Cookie

面试官：谈谈loccalStorage，sessionStorage与Cookie

一：公共点:在客户端存放数据

 

二：区别:

1．数据存放有效期
sessionStorage :仅在当前浏览器窗口关闭之前有效。【关闭浏览器就没了】
localStorage:始终有效，窗口或者浏览器关闭也一直保存，所以叫持久化存储。
cookie:只在设置的cookie过期时间之前有效，即使窗口或者浏览器关闭也有效。

2. localStorage、sessionStorage不可以设置过期时间
cookie有过期时间，可以设置过期(把时间调整到之前的时间，就过期了)

3．存储大小的限制
cookie存储量不能超过4k，有个数限制（各浏览器不同），一般不能超过20个（cookie只能保存字符串。如果你想模拟一个数组，你需要序列化和反序列化它。您可以使用JSON库来做到这一点）。

一般常用的方法就是：①使用 JSON.stringify() 方法 -- 实现从对象转换为 JSON 字符串；

　　　　　　　　　    ②使用 JSON.parse() 方法 -- 实现从 JSON 转换为对象；

localstorage.sessionStorage不能超过5M
***根据不同的浏览器存储的大小是不同的。

 

三：建议使用：
由于 vue 是单页面应用，操作都是在一个页面跳转路由，因此 sessionStorage 较为合适

原因:sessionStorage 可以保证打开页面时 sessionStorage 的数据为空

每次打开页面 localStorage 存储着上一次打开页面的数据，因此需要清空之前的数据