由Cookie詳解我們已經了解到了Cookie是為了實現有狀態的基於HTTP協議的應用而存在的。一個Cookie的由以下幾個部分組成：

//設置cookie的格式和Set-Cookie頭中使用的格式一樣
document.cookie = "name=value; expires=expiration_time; path=domain_path; domain=domain_name; secure"
//這些參數中，只有cookie的名字和值是必需 的。下面是一個簡單的例子。
//需要開一個服務器才能設置成功，本地測試的情況下設置cookie無效
document.cookie = "name=Nicholas";

很顯然，JavaScript中讀寫cookie不是非常直觀， 常常需要寫一些函數來簡化cookie的功能。基本的cookie操作有三種：讀取、寫入和刪除。

關於讀取、寫入、刪除Cookie需要註意哪些情況，可以參考一下這篇文章：聊一聊 cookie。

對於需要同時設置多個參數的情況，我們通常以對象的方式傳入這些參數。

如：

default = {
    ‘name‘: null,
    ‘value‘: null,
    ‘expires‘: new Date().getTime() + (1000*60*60*24),//默認Cookie的有效期為1天
    ‘path‘: ‘/‘,
    
 
‘domain‘: ‘‘,
    ‘secure‘: false
};
//每個參數的意義可以看之前寫的文章

一個完整的cookie操作方法庫。

let cookieRender = (function () {
    //設置一個Cookie
    /**
     * 要想修改一個cookie，只需要重新賦值就行，舊的值會被新的值覆蓋。
     * 但要註意一點，在設置新cookie時，path/domain這幾個選項一定要舊cookie 保持一樣。
     * 否則不會修改舊值，而是添加了一個新的 cookie。
     * params options 對象
     *         name    cookie的名字
     *         value    cookie的值
     *         expires    cookie的過期時間，傳入毫秒數
     *         path    cookie生效的路徑
     *         domain    cookie生效的域
     *         secure    cookie的安全標誌
    
 
*/
    function setValue(options) {//當傳入的參數過多時，可以用一個對象的方式傳入
        let _default = {
            ‘name‘: null,
            ‘value‘: null,
            ‘expires‘: new Date().getTime() + (1000*60*60*24),
            ‘path‘: ‘/‘,
            ‘domain‘: ‘‘,
            ‘secure‘: false
        };
        for (let key in options) {
            if (options.hasOwnProperty(key)){
                _default[key] = options[key];
            }
        }
        document.cookie = _default.name + "=" + escape(_default.value) + "; expires=" + _default.expires + "; path=" + _default.path +  "; domain=" + _default.domain;
        if (_default[‘secure‘]) {
            document.cookie += ‘; secure;‘;
        }
    }
    
    //獲取Cookie
    function getValue(name) {
        let arr = document.cookie.match(new RegExp("(^| )" + name + "=([^;]*)(;|$)"));
        if (arr != null) {
            return unescape(arr[2]);
        }
        return null;
    }
    
    //刪除
    /*
     * 刪除一個cookie 也挺簡單，也是重新賦值，
     * 只要將這個新cookie的expires 選項設置為一個過去的時間點就行了。
     * 但同樣要註意，path/domain/這幾個選項一定要舊cookie 保持一樣。
    */
    function removeValue(options) {
        let _default = {
            name: null,
            path: ‘/‘,
            domain: ‘‘
        };
        for (key in options) {
            if (options.hasOwnProperty(key)) {
                _default[key] = options[key];
            }
            if (this.getValue(_default)) {
                document.cokie = _default.name + "= " + ";path=" + _default.path + ";domain=" + _default.domain + ";expires=" + new Date(0);
            }
        }
    }
    
    return {
        set: setValue,
        get: getValue,
        remove: removeValue
    }
})();

如何封裝一個Cookie庫