In the previous section, we mainly obtained the node object to be operated

This section mainly involves the cookie setting and acquisition operation, using the singleton design pattern for encapsulation design

Single case design pattern

The following is Wikipedia’s introduction to the singleton pattern:

When applying the singleton pattern, the class that generates the singleton must ensure that only one instance exists. In many cases, the entire system Only having a global object is conducive to coordinating the overall behavior of the system. For example, in the configuration file of the entire system, the configuration data has a singleton object for unified reading and modification. When other objects need configuration data, they also obtain the configuration data through this singleton object. This can simplify the configuration in complex environments. Configuration management.

The idea of ??the singleton pattern is: a class can return a reference to an object (and it will always be the same) and a method to obtain the instance (static method, usually using the getInstance name). Then when we call this method, if the reference held by the class is not empty, the reference will be returned. Otherwise, an instance of the class will be created, and the instance reference will be assigned to the reference held by the class and then returned. At the same time, define the constructor of the class as a private method to prevent other functions from using the constructor to instantiate the object, and only obtain the only instance of the class through the static method of the class.

Full form: [] is optional

document.cookie = “name=value[;expires=date][;path=path-to-resource][;domain=domain name][;secure]”

<script>
var cookieObj = {
    /*
     增加或修改cookie
     參數(shù)：o 對象{}
     name:string cookie名
     value:string cookie值
     expires:Date對象 過期時間
     path:string 路徑限制
     domain:string 域名限制
     secure:boolean  true https  false或undeinfed
     */
    set: function(o) {
        var cookieStr = encodeURIComponent(o.name) + "=" + encodeURIComponent(o.value);
        //encodeURIComponent() 函數(shù)可把字符串作為 URI 組件進(jìn)行編碼。
        if(o.expires) {
            cookieStr += ";expires=" + o.expires;
        }
        if(o.path) {
            cookieStr += ";path=" + o.path;
        }
        if(o.domain) {
            cookieStr += ";domain=" + o.domain;
        }
        if(o.secure) {
            cookieStr += ";secure";
        }

        document.cookie = cookieStr;
    },
    /*
     刪除
     參數(shù)：n string cookie的名字
     */
    del: function(n) {
        var date = new Date();
        date.setHours(-1);  //setHours() 方法用于設(shè)置指定的時間的小時字段。
        //this代表的是當(dāng)前函數(shù)的對象
        this.set({
            name: n,
            expires: date
        });
    },
    /*查找*/
    get: function(n) {
        n = encodeURIComponent(n);
        var cooikeTotal = document.cookie;
        var cookies = cooikeTotal.split("; ");
        //split() 方法用于把一個字符串分割成字符串?dāng)?shù)組。
        for(var i = 0, len = cookies.length; i < len; i++) {
            var arr = cookies[i].split("=");
            if(n == arr[0]) {
                return decodeURIComponent(arr[1]);
            //decodeURIComponent() 函數(shù)可對 encodeURIComponent() 函數(shù)編碼的 URI 進(jìn)行解碼。    
            }
        }
    }
}
</script>

Create a cookie.js file and put the above JavaScript code into it.

<script type="text/javascript" src="cookie.js"></script>

Later called from the HTML page to achieve the function module effect.