[toc]
# 本地存儲
## 什么是本地存儲？
將數據存儲在本地，本地一般指瀏覽器、手機等客戶端設備。
## Cookie、localStorage、sessionStorage 的區別？和用法？
1. 歷史
Cookie 是傳統的本地存儲的技術。
localStorage 和 sessionStorage 是 H5 中新加的。
2. 特點
Cookie：數據保存在瀏覽器中，一般每個 Cookie 最大 4K，可以設置過期時間
localStorage 和 sessionStorage：存儲數據比較大，一般5M。
sessionStorage ：關閉瀏覽器，數據就刪除
localStorage：除非手動刪除，否則數據永遠存在
3. 操作方式
Cookie 操作起來比較麻煩，只能通過 document.cookie 來對整個 cookie 進行操作，整個 cookie 是一個字符串。
localStorage 和 sessionStorage 操作方便，可以使用：
localStorage.setItem(鍵，值） 添加數據
localStorage. getItem(鍵） 獲取數據
localStorage.removeItem(鍵） 刪除一個數據
localStorage. clear() 清空
4. 存儲對象
本地存儲時不能直接保存對象類型的數據，需要先序列化然后才能存儲，取出來使用時要先返序列化。
## 什么是序列化和反序列化？
序列化：根據一個規則將對象轉成了個字符串。
返序列化：將序列化的字符串轉回對象。
序列化和反序列化使用 JSON.stringify 和 JSON.parse 方法
~~~
// 對象類型數據
const o = {name:'tom'}
// 序列化成字符串（本地存儲時需要先轉）
const str = JSON.stringify(o)
// 反序列化回對象（使用時需要轉回）
const o1 = JSON.parse(str)
~~~
