一、cookie
cookie算是比較早的技術，最初是為了記錄http的狀態，提高訪問速度。cookie是服務器"種植"在客戶端的key-value形式文本文件。但同時客戶端也能操作cookie。
特點：
大小：cookie的大小限制在4k。每個域名下cookie的個數現在在20個。
在客戶端請求服務器端和服務器響應時，cookie始終被攜帶在http請求中，即使不需要(造成流量浪費)。這也是限制cookie大小的原因。
客戶端可以通過document.cookie操作cookie，並不安全。
cookie可以設置過期時間、路徑、域和httpOnly等字段。如果設置了過期時間，cookie會保存在硬盤里，知道到了設定的過期時間才會失效。若未設置過期時間，在瀏覽器窗口關閉時，cookie就失效了。路徑和域兩個字段限制了cookie的作用范圍。httpOnly設置為true，則js不能通過document.cookie操作cookie。
二、localStorage
它也是采用key-value的形式存儲數據，但是它與cookie有很大的區別
特點：
對比着來，localStorage能保存更大的數據，標准瀏覽器是5Mb。
localStorage保存在客戶端，不隨着請求發送給服務器，避免了流量的浪費。
客戶端可以通過：setItem、getItem方法訪問localStorage。
並且，localStorage沒有過期時間，如果不手動清除，數據就永遠不會過期，一直保存在瀏覽器當中。
存儲的信息在同一域中是共享的。
//key，value 都必須是字符串，storage 的api 只能操作字符串
//設置
window.sessionStorage.setItem(key,value)
//獲取
window.sessionStorage.getItem(key)
//刪除某個數據
window.sessionStorage.removeItem(key)
//清除所有數據
window.sessionStorage.clear()
//獲取某個索引的key
window.sessionStorage.key(index)
三、sessionStorage
特點：
與localStorage不同的是，sessionStorage並不持久化，在窗口關閉那一刻，sessionStorage會被清除。
存儲的信息是會話級別的，同域也是不能共享的。關閉當前標簽頁，sessionStorage即失效。
//存儲
sessionStorage.setItem("key","value"）
//按key獲取值
sessionStorage.getItem(key)
//按key 刪除單個值
sessionStorage.removeItems(key)
//清除所有數據
sessionStorage.clear()
//獲取數據的數量
sessionStorage.length
//獲取全部值
sessionStorage.valueOf()
//sessionStorage也可存儲Json對象：存儲時，通過JSON.stringify()將對象轉換為文本格式；讀取時，通過JSON.parse()將文本轉換回對象。
var userEntity = {
name: 'tom',
age: 22
};
// 存儲值：將對象轉換為Json字符串
sessionStorage.setItem('user', JSON.stringify(userEntity));
// 取值時：把獲取到的Json字符串轉換回對象
var userJsonStr = sessionStorage.getItem('user');
userEntity = JSON.parse(userJsonStr);
console.log(userEntity.name); // => tom
瀏覽器本地存儲統稱為webStorage，包括了localStorage和sessionStorage
四、session(附加)
上面提到了cookie，順帶提一下session。客戶端第一次訪問服務器，服務器種植一個cookie，保存唯一的sessionId。后面客戶端再次訪問，會讀取此sessionId，隨即能在服務端讀取到此id保存的會話對象。
特點：
session是基於cookie的，由於session在客戶端不可被修改，相對於cookie來說安全，所以可存放一些重要數據。
數據保存在服務器端，客戶端通過sessionId，讀取到相對應的數據。