Cookie、Localstorage、Sessionstorage

Cookie

Cookie设计初衷是用来和服务器通讯，而不是本地存储，他只是被‘借用’到本地存储。

如下图，每次http请求，header都携带cookie;

localStorage、sessionStorage

在HTML5中，新加入了一个localStorage/sessionStorage特性，这个特性主要是用来作为本地存储来使用的，解决了cookie存储空间不足的问题(cookie中每条cookie的存储空间为4k)，localStorage中一般浏览器支持的是5M大小。

localStorage、sessionStorage与cookie相比：

localStorage、sessionStorage不同点：

localStorage、sessionStorage API有哪些

localStorage只支持string类型的存储。

var storage=window.localStorage;
   //写入a字段
   storage["a"]=1;
   //写入b字段
   storage.a=1;
   //写入c字段
   storage.setItem("c",3);
   //获取a 
   storage.getItem('a');
   storege.a;
   storage["a"]
   console.log(typeof storage["a"]);// string
   storage.clear();//删除所有
   storage.removeItem("a");//删除某个
   //使用key()方法，向其中出入索引即可获取对应的键
   for(var i=0;i<storage.length;i++){
       var key=storage.key(i);
       console.log(key);
   }
  //将JSON存入localStorage中,使用JSON.stringify()这个方法，来将JSON转换成为JSON字符串
  var data={
      name:'xiecanyong',
      sex:'man',
      hobby:'program'
  };
  var d=JSON.stringify(data)
  storage.setItem("data",d);
  //将JSON字符串转换成为JSON对象输出
  var json=storage.getItem("data");
  var jsonObj=JSON.parse(json);

sessionStorage操作同上.