localStorage

• 首先要 var storage = window.localStorage

  var storage=window.localStorage;

• 存

三種方式分別是：. 和 [] 和 setItem("key","val")

    var storage=window.localStorage;
    storage.a="warm";
    storage['b']="warm1";
    storage.setItem("c","warm2");
    console.log(storage.a) //warm
    console.log(storage.b) //warm1
    console.log(storage.c) //warm2
    

• 取

三種方式分別是：.和[]和 storage.getItem("key")

   var storage=window.localStorage;
    storage.a="warm";
    storage['b']="warm1";
    storage.setItem("c","warm2");
    console.log(storage.a)
    console.log(storage["b"])
    console.log(storage.getItem("c"))

• 刪

clear() 全部刪除 和 removeItem("key")移除某一個

var storage=window.localStorage;
    storage.a="warm";
    storage['b']="warm1";
    storage.setItem("c","warm2");

    storage.clear()//全部移除
    storage.removeItem("b")//只移除b

• 循環(huán)

  var storage=window.localStorage;
    storage.a="warm";
    storage['b']="warm1";
    storage.setItem("c","warm2");
   //console.dir(storage);
    var ary=[]
   for(var i=0;i<storage.length;i++){
       console.log(storage.key(i))//a,b,c
       ary.push(storage.getItem(storage.key(i)))// 取value
    }
    console.log(ary);//["warm", "warm1", "warm2"]

• 注意事項
  • 一般我們會將JSON存入localStorage中，但是在localStorage會自動將localStorage轉(zhuǎn)換成為字符串形式；
    這個時候我們可以使用JSON.stringify()這個方法，來將JSON轉(zhuǎn)換成為JSON字符串
  • 讀取之后要將JSON字符串轉(zhuǎn)換成為JSON對象，使用JSON.parse()方法

• localStorage 優(yōu)缺點

• 優(yōu)勢：
  1、localStorage拓展了cookie的4K限制
  2、localStorage會可以將第一次請求的數(shù)據(jù)直接存儲到本地，這個相當(dāng)于一個5M大小的針對于前端頁面的數(shù)據(jù)庫，相比于cookie可以節(jié)約帶寬，IE8以上支持
• 不足：
  1、瀏覽器的大小不統(tǒng)一，并且在IE8以上的IE版本才支持localStorage這個屬性
  2、目前所有的瀏覽器中都會把localStorage的值類型限定為string類型，這個在對我們?nèi)粘１容^常見的JSON對象類型需要一些轉(zhuǎn)換
  3、localStorage在瀏覽器的隱私模式下面是不可讀取的
  4、localStorage本質(zhì)上是對字符串的讀取，如果存儲內(nèi)容多的話會消耗內(nèi)存空間，會導(dǎo)致頁面變卡
  5、localStorage不能被爬蟲抓取到

localStorage與sessionStorage的唯一一點區(qū)別就是localStorage屬于永久性存儲，而sessionStorage屬于當(dāng)會話結(jié)束的時候，sessionStorage中的鍵值對會被清空