1.localStorage
特點(diǎn)：
存儲控件是5M
存儲條數(shù)受存儲空間影響
可以增刪改查
-
存儲的數(shù)據(jù)只支持字符串（重點(diǎn)Ｂ取！ｕ逦觥Ｌ蚴尽！）
- JSON.parse(json格式字符串)
- JSON.stringify()
遵循同源策略
只要在同源的網(wǎng)址里面电抚，localStorage里面的數(shù)據(jù)可以共享
會一致存在瀏覽器中惕稻，除非主動銷毀removeItem() / clear()
常用的方法：
window.localStorage.setItem(key,value);//設(shè)置存儲的內(nèi)容
window.localStorage.getItem(key);//獲取內(nèi)容
window.localStorage.removeItem(key);//刪除內(nèi)容
window.localStorage.clear();//清空內(nèi)容
同源策略
兩個網(wǎng)址是否同源，取決于 http協(xié)議蝙叛，域名/ip地址俺祠，端口號是否全都一致
url的組成
http協(xié)議，域名/IP地址借帘，端口號蜘渣，路徑，查詢參數(shù)/動態(tài)參數(shù)
url的組成.png
2.sessionStorage
特點(diǎn)：
生命周期為關(guān)閉當(dāng)前瀏覽器窗口
可以在同一個窗口下訪問
數(shù)據(jù)大小為5M左右
臨時存儲：當(dāng)瀏覽器關(guān)閉或者標(biāo)簽頁關(guān)閉的時候肺然，就會銷毀本地的存儲內(nèi)容
存儲的數(shù)據(jù)類型：和localStorage一樣只能是字符串
sessionStorage：不符合同源 策略
不支持?jǐn)?shù)據(jù)共享蔫缸，同源頁面也不支持?jǐn)?shù)據(jù)共享
常用的方法：
window.sessionStorage.setItem(key,value);//設(shè)置存儲的內(nèi)容
window.sessionStorage.getItem(key);//獲取內(nèi)容
window.sessionStorage.removeItem(key);//刪除內(nèi)容
3.cookie
特點(diǎn)
- 存儲在客戶端，不占用服務(wù)器資源
- 存儲量有限际起，一般為4KB
- 只能是字符串格式
cookie的組成
key：鍵
value：值
domain：域拾碌，表達(dá)這個cookie是屬于哪個網(wǎng)站的
path：路徑吐葱，表達(dá)這個cookie是屬于該網(wǎng)站的哪個基路徑的，就好比是同一家公司不同部門會頒發(fā)不同的出入證校翔。比如
/news唇撬，表示這個cookie屬于/news這個路徑的。secure：是否使用安全傳輸
expire：過期時間展融，表示該cookie在什么時候過期
4.cookie窖认，localStorage，sessionStorage的區(qū)別
| 特性 | cookie | localStorage | sessionStorage |
|---|---|---|---|
| 生命周期 | 可以設(shè)置失效時間告希，沒有設(shè)置的化扑浸，默認(rèn)為是關(guān)閉瀏覽器后失效 | 除非被清除，否則永久保存 | 僅在當(dāng)前會話下有效燕偶，關(guān)閉頁面或者瀏覽器后被清除 |
| 存放數(shù)據(jù)大小 | 4k左右 | 一般為5MB | 一般為5MB |
| HTTP請求 | 每次都會攜帶在HTTP頭中喝噪，如果使用cookie保存過多數(shù)據(jù)會帶來性能問題 | 僅在客戶端（即瀏覽器）中保存，不參與和服務(wù)器通信 | 僅在客戶端（即瀏覽器）中保存指么，不參與和服務(wù)器通信 |
| 易用性 | 需要自己封裝，原生的cookie接口不友好 | 原生接口可以接受伯诬，也可以再次封裝 | 原生接口可以接受，也可以再次封裝 |
