localStorage
localStorage生命周期是永久，這意味著除非用戶顯示在瀏覽器提供的UI上清除localStorage信息，否則這些信息將永遠存在。存放數(shù)據(jù)大小為一般為5MB,而且它僅在客戶端（即瀏覽器）中保存，不參與和服務器的通信。
sessionStorage
sessionStorage僅在當前會話下有效，關(guān)閉頁面或瀏覽器后被清除。存放數(shù)據(jù)大小為一般為5MB,而且它僅在客戶端（即瀏覽器）中保存，不參與和服務器的通信。源生接口可以接受，亦可再次封裝來對Object和Array有更好的支持。
作用域不同
不同瀏覽器無法共享localStorage或sessionStorage中的信息。相同瀏覽器的不同頁面間可以共享相同的 localStorage（頁面屬于相同域名和端口），但是不同頁面或標簽頁間無法共享sessionStorage的信息。這里需要注意的是，頁面及標 簽頁僅指頂級窗口，如果一個標簽頁包含多個iframe標簽且他們屬于同源頁面，那么他們之間是可以共享sessionStorage的。
Cookie
生命期為只在設置的cookie過期時間之前一直有效，即使窗口或瀏覽器關(guān)閉。 存放數(shù)據(jù)大小為4K左右 。有個數(shù)限制（各瀏覽器不同），一般不能超過20個。與服務器端通信：每次都會攜帶在HTTP頭中，如果使用cookie保存過多數(shù)據(jù)會帶來性能問題。但Cookie需要程序員自己封裝
cookie的優(yōu)點：具有極高的擴展性和可用性
1.通過良好的編程，控制保存在cookie中的session對象的大小。
2.通過加密和安全傳輸技術(shù)，減少cookie被破解的可能性。
3.只有在cookie中存放不敏感的數(shù)據(jù)，即使被盜取也不會有很大的損失。
4.控制cookie的生命期，使之不會永遠有效。這樣的話偷盜者很可能拿到的就 是一個過期的cookie。
cookie的缺點：
1.cookie的長度和數(shù)量的限制。每個domain最多只能有20條cookie，每個cookie長度不能超過4KB。否則會被截掉。
2.安全性問題。如果cookie被人攔掉了，那個人就可以獲取到所有session信息。加密的話也不起什么作用。
3.有些狀態(tài)不可能保存在客戶端。例如，為了防止重復提交表單，我們需要在服務端保存一個計數(shù)器。若吧計數(shù)器保存在客戶端，則起不到什么作用。
localStorage、sessionStorage、Cookie共同點：都是保存在瀏覽器端，且同源的。
localStorage和sessionStorage的方法
setItem存儲value
用途：將value存儲到key字段
sessionStorage.setItem("key", "value");
localStorage.setItem("site", "js8.in");
getItem獲取value
用途：獲取指定key本地存儲的值
var value = sessionStorage.getItem("key");
var site = localStorage.getItem("site");
removeItem刪除key
用途：刪除指定key本地存儲的值
sessionStorage.removeItem("key");
localStorage.removeItem("site");
clear清除所有的key/value
用途：清除所有的key/value
sessionStorage.clear();
localStorage.clear();
存儲數(shù)據(jù)
3.1.1 采用setItem()方法存儲
sessionStorage.setItem(``'testKey'``,``'這是一個測試的value值'``); ``// 存入一個值
3.1.2 通過屬性方式存儲
sessionStorage[``'testKey'``] = ``'這是一個測試的value值'``;`
3.2 讀取數(shù)據(jù)
3.2.1 通過getItem()方法取值
sessionStorage.getItem(``'testKey'``); ``// => 返回testKey對應的值`
3.2.2 通過屬性方式取值
sessionStorage[``'testKey'``]; ``// => 這是一個測試的value值`
3.3 存儲Json對象
sessionStorage也可存儲Json對象：存儲時，通過JSON.stringify()將對象轉(zhuǎn)換為文本格式；讀取時，通過JSON.parse()將文本轉(zhuǎn)換回對象。
var userEntity = {
name: 'tom'
age: 22
};
// 存儲值：將對象轉(zhuǎn)換為Json字符串
sessionStorage.setItem('user', JSON.stringify(userEntity));
// 取值時：把獲取到的Json字符串轉(zhuǎn)換回對象
var userJsonStr = sessionStorage.getItem('user');
userEntity = JSON.parse(userJsonStr);
console.log(userEntity.name); // => tom
