浏览器存储
在某些情况下，我们需要在浏览器中存储一些数据。不同于普通的JS对象，我们需要存储的数据可以持久、稳定的存储。
持久和稳定体现在：
不会因为页面刷新而丢失数据
当页面重新打开时，我们可以获得之前存储的数据
同一个域下的网页可以共享数据
*存储的数据可以让服务器端知晓（这条不是不必要）
购物车就是一个很好的例子，我们希望购物车的数据存储可以满足以上四点。
我们可以通过 Cookie 或者 Web Storage 来实现我们的需求。
Cookie
什么是 Cookie
Cookie 是一些数据, 存储于你电脑上的文本文件中。
当 web 服务器向浏览器发送 web 页面时，在连接关闭后，服务端不会记录用户的信息。
Cookie 的作用就是用于解决 "如何记录客户端的用户信息"
Cookie 以名/值对形式存储，如下所示:
username=Mark
当浏览器从服务器上请求 web 页面时， 属于该页面的 Cookie 会被添加到该请求中。服务端通过这种方式来获取用户的信息。
创建Cookie
JavaScript 可以使用 document.cookie 属性来创建 、读取、及删除 cookie。
JavaScript 中，创建 cookie 如下所示：
document.cookie="username=Mark";
还可以为 cookie 添加一个过期时间（以 UTC 或 GMT 时间）。默认情况下，cookie 在浏览器关闭时删除：
document.cookie="username=Mark; expires=Thu, 18 Dec 2018 12:00:00 GMT";
可以使用 path 参数告诉浏览器 cookie 的路径。默认情况下，cookie 属于当前页面。
document.cookie="username=Mark; expires=Thu, 18 Dec 2013 12:00:00 GMT; path=/";
读取 Cookie
在 JavaScript 中, 可以使用以下代码来读取 cookie：
var x = document.cookie;
修改 Cookie
在 JavaScript 中，修改 cookie 类似于创建 cookie，如下所示：
document.cookie="username=Mark2; expires=Thu, 18 Dec 2013 12:00:00 GMT; path=/";
删除 Cookie
删除 cookie 非常简单。您只需要设置 expires 参数为以前的时间即可，如下所示，设置为 Thu, 01 Jan 1970 00:00:00 GMT:
document.cookie = "username=; expires=Thu, 01 Jan 1970 00:00:00 GMT";
注意，删除时不必指定 cookie 的值。
Cookie 字符串
document.cookie 属性看起来像一个普通的文本字符串，但实际上不是。
即使在 document.cookie 中写入一个完整的 cookie 字符串, 重新读取该 cookie 信息时，cookie 信息是以名/值对的形式展示的。
同时当我们设置了新的 cookie，旧的 cookie 不会被覆盖。 新 cookie 将添加到 document.cookie 中，将获得如下所示的数据：
cookie1=value; cookie2=value;
Web Storage
在没有Web Storage之前，是通过cookie来在客户端存储数据的。但是由于
浏览器能存cookie数比较少。如IE8，Firefox,opera每个域可以保存的50个cookie,Safari/WebKit没有限制。一个cookie最多可以存放4096B左右的数据
每次请求时，cookie都会存放在请求头中，传输到服务器端。但如果请求头大小超过了限制，服务器会处理不了。
因此cookie不适合大量数据的存储。相比用Web Storage更适合存储大量数据:
每个域Chrome，Firefox和Opera是5M，IE是10M。
请求时不会带web stroge的内容。
localStorage 和 sessionStorage
他们都只能读写当前域的数据，区别是，localStorage存储的数据不会过期，sessionStorage存储的数据每次关闭浏览器后都会被清空。
localStorage和sessionStorage的api是一样的。后面的 API 介绍以 localStorage为例
创建和修改
/*
* value会被调用 .toString方法转化成字符串。因此，如果要储存的对象，调用JSON.stringify(obj)来序列化成字符串
*/
localStorage.setItem('key', 'value');
读取
localStorage.getItem('key');
localStorage.key(index);//localStorage数组中下标是index的key
删除
localStorage.removeItem('key');//删除某一个localStorage
localStorage.clear();//清空所有localStorage
当然，更简便的，我们也可以像访问普通对象一样访问 localStorage
// 创建或是修改
localStorage.key = "value"
// 读取
console.log(localStorage.key)
// 删除
delete localStorage.key