今天主要来讲下前端的数据存储，说起数据存储，大家肯定第一时间想起cookie，localstorage，sessionstorage，而其实还有userData和IndexedDB这两种数据存储，接下来将对它们进行一个比较详细的总结

一、为什么要进行数据存储

随着Web应用程序的出现，慢慢的也开始产生了对于能够直接在客户端上存储用户信息能力的要求，我们知道当我们访问某个页面的时候，很多东西都需要从服务器端进行加载，如果这个时候能将一些东西存储在客户端的话，是不是就可以直接拿来用啦，方便快捷，速度又快，又可以节省了很多不必要的请求，为什么不用呢？

其实在我实习的时候，曾经做过一个功能，当某条广告更新的时候右上角出现小红点，用户点击过后就不出现小红点，直到广告更新的时候小红点再出现，这个功能当时我就用到了客户端数据存储来实现啦，其实像一些登录信息，偏好设定都可以存储在客户端，而首先进行客户端存储的方案就是cookie，而今天，cookie只是在客户端存储数据的其中一种方式，接下来，我们将介绍各种客户端的数据存储方式

二、cookie

1、cookie的作用　　

说到cookie，其实cookie有两个主要功能，第一个功能就是用于解决http无状态的缺点，在客户端存储会话信息，记录用户的状态，而第二个功能也就是我们现在也经常使用cookie在客户端存储一些其它的数据

2、cookie的构成

一般来说，cookie是由浏览器保存的以下几块信息构成的

(1)名称：一个唯一确定cookie的名称

(2)值：存储在cookie中的字符串值，值必须被URL编码

(3)域：cookie对于哪个域是有效的，所有向该域发送的请求都会包含这个cookie信息

(4)路径：对于指定域中的路径，应该向服务器发送cookie

(5)失效时间：表示cookie何时应该被删除的时间戳

(6)安全标志：指定后，cookie只有在使用SSL连接的时候才发送到服务器

3、如何使用cookie存储数据

一般来说，有两种方式可以生成cookie，一种是服务器发送http响应时指定Set-Cookie进行指定，另一种我们可以使用js生成cookie

由于cookie需要通过URL编码，因此在写入cookie时和读取cookie时我们都需要进行编码和解码操作，为了方便，我们可以自己写一个cookie的操作对象

var CookieUtil = { get: function(name) { var cookieName = encodeURIComponent(name) + "=