# :-: localStorage的優勢 1、localStorage拓展了cookie的4K限制 2、localStorage會可以將第一次請求的數據直接存儲到本地，這個相當于一個5M大小的針對于前端頁面的數據庫，相比于cookie可以節約帶寬，但是這個卻是只有在高版本的瀏覽器中才支持的 # :-: localStorage的局限 1、瀏覽器的大小不統一，并且在IE8以上的IE版本才支持localStorage這個屬性 2、目前所有的瀏覽器中都會把localStorage的值類型限定為string類型，這個在對我們日常比較常見的JSON對象類型需要一些轉換 3、localStorage在瀏覽器的<span style="color:red;">隱私模式</span>下面是不可讀取的 4、localStorage本質上是對字符串的讀取，如果存儲內容<span style="color:red;">多的話會消耗內存空間</span>，會導致頁面變卡 5、localStorage不能被爬蟲抓取到 localStorage與sessionStorage的唯一一點區別就是localStorage屬于<span style="color:red;">永久性存儲</span>，而sessionStorage屬于當<span style="color:red;">會話結束</span>的時候，sessionStorage中的鍵值對會被清空 6、localStorage的使用也是遵循<span style="color:red;">同源策略</span>的，所以不同的網站直接是不能共用相同的localStorage # :-: localStorage的瀏覽器支持情況：  # :-: localStorage的使用 - 首先在chmor瀏覽器f12中的console中輸入localStorage - 然后就彈出了一些列宿主（瀏覽器）提供的localStorage自帶的方法，摘錄了一些常用的API如下表所示： | 名稱 | 功能 | | --- | --- | | setItem | 存儲數據【增】 | | getItem | 讀取數據【查單個】 | | removeItem | 刪除某個數據【刪單個】 | | clear | 刪除全部數據【刪全部】| | length | localStorage存儲變量的個數【計算數據總數】 | | key | 讀取第i個數據的名字或稱為鍵值(從0開始計數) | | valueOf | 獲取所有存儲的數據【查全部】 | | hasOwnProperty | 檢查localStorage上是否保存了變量x，需要傳入x【判斷】 | | propertyIsEnumerable | 用來檢測屬性是否屬于某個對象的【判斷】 | | toLocaleString | 將（數組）轉為本地字符串 | 1、【增】添加數據。注意：【改】是重新賦值和增的用法一致 參數：格式為key = value形式。數據類型為：字符串，也可以用變量  2、【查】讀取數據  3、【改】  4、【刪】  5、【判斷】  6、轉換成字符串  7、將JSON存儲到localStorage里  使用場景：后臺傳遞json格式的經緯度給前臺，前臺讓它在地圖上渲染出來，而且是兩個不同的js文件傳遞，然后就使用了這個方法。 &nbsp; 簡單說是跨js傳遞json值，通過localStorage中轉，有種壓縮和解壓縮的味道在。