先來幾道面試題
1、a.meituan.com和b.meituan.com這兩個域能夠共享同一個localStorage嗎？
2、在webview中打開一個頁面：i.meituan.com/home.html，點擊一個按鈕，調用js橋打開一個新的webview：i.meituan.com/list.html，這兩個分屬不同webview的頁面能共享同一個localStorage嗎？
3、如果localStorage存滿了，再往裏存東西，或者要存的東西超過了剩餘容量，會發生什麼？
好了帶着這些問題我們來往下看
1、基本方法
// 用於存入數據
window.localStorage.setItem('key', 'value');
// 用於讀取數據
window.localStorage.getItem('key')
//清除某個鍵名對應的鍵值
localStorage.removeItem('key');
// 用於清除所有保存的數據
window.localStorage.clear()
// localStorage.key()接受一個整數作為參數（從零開始），返回該位置對應的鍵值。
localStorage.key(0)
// Storage 接口儲存的數據發生變化時，會觸發 storage 事件，可以指定這個事件的監聽函數。利用這個可以實現跨tab頁通信
window.addEventListener('storage', onStorageChange);
注意點：localStorage只能存String類型的字符串。存對象的時候會變成"[object Object]"，因為({key:'xxx'}).toString()//"[object Object]"。這個時候我們可以通過JSON.stringify()。來幫我們實現轉化。例如：localStorage.setItem('jsonString', JSON.stringify({key: 'mtt'}))
2、作用域
localStorage只要在相同的協議、相同的主機名、相同的端口下，就能讀取/修改到同一份localStorage數據。這就回答了我們上面的前二個問題了，
第一題：由於域名不同，不能進行共享。
第二題：二個webview相當於同一個瀏覽器的不同標籤頁。所以可以共享。
與sessionStorage 、cookie 對比
localstorage在所有同源窗口中都是共享的；也就是説只要瀏覽器不關閉，數據仍然存在sessionStorage:不能在不同的瀏覽器窗口中共享，即使是同一個頁面；cookie: 也是在所有同源窗口中都是共享的.也就是説只要瀏覽器不關閉，數據仍然存在
3、數據存儲有效期
localStorage理論上來説是永久有效的，即不主動清空的話就不會消失，即使保存的數據超出了瀏覽器所規定的大小，也不會把舊數據清空而只會報錯(這裏解答了上面的第三題)。但需要注意的是，在移動設備上的瀏覽器或各Native App用到的WebView裏，localStorage都是不可靠的，可能會因為各種原因（比如説退出App、網絡切換、內存不足等原因）被清空。
與sessionStorage 、cookie 對比
- localStorage：始終有效，窗口或瀏覽器關閉也一直保存，本地存儲，因此用作持久數據；
- sessionStorage：僅在當前瀏覽器窗口關閉之前有效；
- cookie：只在設置的cookie過期時間之前有效，即使窗口關閉或瀏覽器關閉
4、數據存儲方面
sessionStorage和localStorage不會自動把數據發送給服務器，僅在本地保存。cookie數據始終在同源的http請求中攜帶（即使不需要），即cookie在瀏覽器和服務器間來回傳遞。cookie數據還有路徑（path）的概念，可以限制cookie只屬於某個路徑下
$ 5、存儲數據大小
cookie數據不能超過4K，同時因為每次http請求都會攜帶cookie、所以cookie只適合保存很小的數據，如會話標識。sessionStorage和localStorage雖然也有存儲大小的限制，但比cookie大得多，可以達到5M或更大
Web Storage擁有setItem、getItem、removeItem、clear等方法，不像cookie需要自己封裝setCookie、getCookie等方法
