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")移除某一個(gè)

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"]

• 注意事項(xiàng)
  • 一般我們會(huì)將JSON存入localStorage中，但是在localStorage會(huì)自動(dòng)將localStorage轉(zhuǎn)換成為字符串形式；
    這個(gè)時(shí)候我們可以使用JSON.stringify()這個(gè)方法店煞，來(lái)將JSON轉(zhuǎn)換成為JSON字符串
  • 讀取之后要將JSON字符串轉(zhuǎn)換成為JSON對(duì)象朽寞，使用JSON.parse()方法

• localStorage 優(yōu)缺點(diǎn)

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

localStorage與sessionStorage的唯一一點(diǎn)區(qū)別就是localStorage屬于永久性存儲(chǔ)，而sessionStorage屬于當(dāng)會(huì)話結(jié)束的時(shí)候玫锋，sessionStorage中的鍵值對(duì)會(huì)被清空