cookie, localStorage和sessionStorage区别

cookie

描述
—— 用于客户端和服务端通信
—— 本身有存储功能，于是被“借用”
—— 使用document.cookie=...获取即可
—— 有效期，在cookie过期时间之前有效，即使关闭浏览器或者窗口。会话cookie（没有设置时间）是窗口关闭就清除

缺点
——  存储量太小，数据不能超过4k
—— 始终在请求中携带，会影响获取资源的效率
—— API太过简单，存储的是字符串，需要封装才能使用

localStorage和sessionStorage

共同点
—— HTML5专门为了存储而设计的API，最大容量是5M
—— API简单易用
—— localStorage.setItem(key, value);localStorage.getItem(key)
—— sessionStorage.setItem(key, value);sessionStorage.getItem(key)
—— IOS safari隐藏模式下，localStorage.getItem会报错，建议统一用try...catch封装

区别
—— 数据有效期不一样，sessionStorage只在当前浏览器窗口关闭之前有效；localStorage除非主动清除，不然一直存在，包括浏览器关闭，一般 做持久数据。
—— 相同浏览器下，sessionStorage在不同标签页之间数据无法共享，localStorage可以。
—— localStorage支持事件通知机制，可以将数据更新通知给监听者