Cookie缓存是网页常用功能之一，记录账号、缓存设置和统计触发次数等，涉及到网页的方方面面应用，给网页增加灵性。

document.cookie 参数：

JSdocument.cookie="key=value; expires=Thu, 1 Dec 2021 00:00:00 GMT; path=/";

Javascript 虽然给出 document.cookie 缓存功能，不过缓存过程数据处理过于繁琐，不利于直接使用。为此，需要将这些过程封装，简化，参考 PHP 的 Cookie 函数设计出新的 Javascript 版的 Cookie 函数。

set 函数：

JS/**
 * 设置cookie的数据
 * @param {String} key 关键字
 * @param {String} value 值
 * @param {Number} days 天数
 */
var set = function (key, value, days) {
    var days = days || 7;
    var exp = new Date();
    exp.setTime(exp.getTime() + days * 24 * 60 * 60 * 1000);
    document.cookie = key + "=" + escape(value) + ";expires=" + exp.toGMTString() + ";path=/;domain=" + window.location.host;
}

缓存数据，首先确定缓存参数名称，起名一般需要加前缀，如用户的名称：u_name。参数名同路径上是唯一的，重名会覆盖前面的参数值。其二缓存时间，缓存的时间从当前开起算起，一般按天数来缓存，超出指定时间，缓存值自动消失。

※ 同个域名下，多个子域名，需要定义domin值，防止设置的值不生效。

get 函数：

JS/**
 * 获得cookie值
 * @param {String} key 关键字
 * @returns {null}
 */
var get = function (key) {
    var arr = document.cookie.match(new RegExp("(^| )" + key + "=([^;]*)(;|$)"));
    if (arr != null) {
        return unescape(arr[2]);
    } else {
        return null;
    }
}

获取缓存值，知道缓存的参数名称，可获得值。提前注意，缓存的值有可能没有赋值或已失效，默认返回 null。

del 函数：

JS/**
 * 删除cookie值
 * @param {String} key 关键字
 */
var del = function (key) {
    var val = get(key);
    var exp = new Date();
    exp.setTime(exp.getTime() - 1000);
    if (val != null) {
        document.cookie = key + "=" + val + ";expires=" + exp.toGMTString() + ";path=/;domain=" + window.location.host;
    }
}

删除缓存值，知道缓存的参数名称，重新将有效时间设置为过去时间，值自动失效。

定义三个函数后，肯定不能直接单独放出来使用，会「污染」全局变量，容易造成函数名冲突，而且时间久了，看不出三个函数之间有什么关联性。基于三个函数的基础上，进一步封装，模块化。

JS/**
 * cookie
 * 操作cookie的添加、修改和删除
 *
 * @author keepsilent
 * @version 1.0.0
 */
var cookie = (function () {

   //do something
   ...

    return {
        set: set,
        get: get,
        del: del
    }
})();

模块化的后使用：

JScookie.set('u_name','keepsilent');
console.log('name:',cookie.get('u_name'))); //输出结果 name: keepsilent

cookie.del('u_name');
console.log('name:',cookie.get('u_name'))); //输出结果 name: null

缓存 Cookie 值有个缺点，只能存储字符串数据。解决这个问题也很简单，先将数据转换成对象，再转义成字符串，这里使用到 JSON.stringify 和 JSON.parse 进行加密与解密即可。

JSON.stringify：对象转义成字符串

JSvar user = { name: 'keepsilent', sex: '男'};
cookie.set('user',JSON.stringify(user)));

JSON.parse：字符串转义对象

JSvar user = { name: 'keepsilent', sex: '男'};
cookie.set('user',JSON.stringify(user)));