了解localStorage、sessionStorage

在HTML5中，新加入了一个localStorage特性，这个特性主要是用来作为本地存储来使用。
解决了cookie存储空间不足的问题(cookie中每条cookie的存储空间为4k)，
localStorage中一  般浏览器支持的是5M大小，
这个在不同的浏览器中localStorage会有所不同。
在HTML5中，本地存储是一个window的属性，包括localStorage和sessionStorage，
 从名字    应该可以很清楚的辨认二者的区别，
前者是一直存在本地的，后者只是伴随着session，窗口一旦关闭就没了。
 以下是localStorage 和sessionStorage的区别。
 (1)localStorage和sessionStorage一样都是用来存储客户端临时信息的对象
 (2)他们均只能存储字符串类型的对象（虽然规范中可以存储其他原生类型的对象，
    但是目前为止没有浏览器对其进行实现）
 (3)localStorage生命周期是永久，这意味着除非用户显示在浏览器提供的UI上清除
   localStorage信息，否则这些信息将永远存在。
 (4)sessionStorage生命周期为当前窗口或标签页，一旦窗口或标签页被永久关闭了，
    那么所有通过sessionStorage存储的数据也就被清空了。
 (5)不同浏览器无法共享localStorage或sessionStorage中的信息。
     相同浏览器的不同页面间可以共享相同的localStorage（页面属于相同域名
     和端口），但是不同页面或标签页间无法共享sessionStorage的信息。
      这里需要注意的是，页面及标签页仅指顶级窗口，
  如果一个标签页包含多个iframe标签且他们属于同源页面，
  那么他们之间是可以共享sessionStorage的。

一、localStorage

优势

1、localStorage拓展了cookie的4K限制
2、localStorage会可以将第一次请求的数据直接存储到本地，这个相当于一个5M大小的针对
   于前端页面的数据库，
  相比于cookie可以节约带宽，但是这个却是只有在高版本的浏览器中才支持的

不足

1、浏览器的大小不统一，并且在IE8以上的IE版本才支持localStorage这个属性
2、目前所有的浏览器中都会把localStorage的值类型限定为string类型，
    这个在对我们日常比较常见的JSON对象类型需要一些转换
3、localStorage在浏览器的隐私模式下面是不可读取的
4、localStorage本质上是对字符串的读取，如果存储内容多的话会消耗内存空间，
   会导致页面变卡
5、localStorage不能被爬虫抓取到

localStorage与sessionStorage的唯一一点区别就是localStorage属于永久性存储，
而sessionStorage属于当会话结束的时候，sessionStorage中的键值对会被清空

使用

if(window.localStorage)通过这种方式来判断浏览器是否支持 


写入
var storage=window.localStorage;
    //写入a字段
    storage["a"]=1;
    //写入b字段
    storage.a=1;
    //写入c字段
    storage.setItem("c",3);
    三种写入方式

注意：localStorage只支持string类型的存储。如果要存对象，数组1等需要将数据转为json字符串存储




读取
正对于上面的数据进行读取
  //第一种方法读取
    var a=storage.a;
    //第二种方法读取
    var b=storage["b"];
    //第三种方法读取
    var c=storage.getItem("c");
都可以读取到

删除

先说一下修改，修改就是当这个键存在时，进行修改，就是重新赋值，会覆盖之前的值，就算没有这个键，也会创建一个新的键来赋值存入

》将localStorage的所有内容清除
var storage=window.localStorage;
storage.clear();
清楚所有

-----------------

将localStorage中的某个键值对删除
var storage=window.localStorage;
storage.removeItem("a");
清楚指定的键

localStorage的键获取

         var it=window.localStorage;
			for(var a=0;a<it.length;a++){
				var j=it.key(a);
			}
  通过这种方式可以获取键名

由于目前的localStolage只支持string,所以我们存的时候存的是字符串, 对象和数组我们就是要用JSON.stringify(?) 将数据转为json字符串， 当然不要忘了，使用的时候，取回数据要将json转换回来JSON.parse(json)， 转换回来是object类型。 我们可以使用 typeof来获取数据的类型 当我们将值存入本地时，可以获取值来看他的类型。

如：console.log(typeof 值)

二，sessionStorage

sessionStorage 用于临时保存同一窗口(或标签页)的数据， 在关闭窗口或标签页之后将会删除这些数据。

使用

它的存储方式和localstorage是一样的

     var va=window.sessionStorage;  
			va.setItem("vv","bb");
			va["c"]="ccc"
			va.b="dd"   
	这是三种存值得方式

获取
var lastname = sessionStorage.getItem("key");
            console.log(lastname .b)
			console.log(lastname .getItem("vv"))
			console.log(lastname ["c"])
			获取得方式也是一样的也有三种


sessionStorage.removeItem("key");  删除指定键
sessionStorage.clear(); 删除所有键


获取所有键和localstorage

说白了localStorage和sessionStorage其实使用方式一样，只不过一个是保存会话数据，
有时间有期限得，而localStorage是没有期限得，