Cookie的相关操作

• cookie : 存储数据，当用户访问了某个网站（网页）的时候，我们就可以通过cookie来像访问者电脑上存储数据

  1. 不同的浏览器存放的cookie位置不一样，也是不能通用的
  2. cookie的存储是以域名形式进行区分的
  3. cookie的数据可以设置名字的
  4. 一个域名下存放的cookie的个数是有限制的，不同的浏览器存放的个数不一样
  5. 每个cookie存放的内容大小也是有限制的，不同的浏览器存放大小不一样

• 我们通过document.cookie来获取当前网站下的cookie的时候，得到的字符串形式的值，他包含了当前网站下所有的cookie。他会把所有的cookie通过一个分号+空格的形式串联起来

• 如果我们想长时间存放一个cookie。需要在设置这个cookie的时候同时给他设置一个过期的时间
  cookie默认是临时存储的，当浏览器关闭进程的时候自动销毁

<script>
    /** 
    *   coolie的设置与调用
    */
    document.cookie = "username='小明'"
    document.cookie = "age='15'"
    console.log(document.cookie) //返回的是一个字符串形式的数据

    /** 
    *   设置cookie保存时间
    */
    var oDate = new Date()
    oDate.setDate(oDate.getDate() + 7) //设置保存的时间

    //由于cookie保存的是字符串格式的时间，所以进行转换；oDate.toCMTString()不赞成使用，并且由oDate.toUTCString()取代，所以返回的格式和内容均相同
    document.cookie = "username='小红';expires=" + oDate.toUTCString()

    /**
    *   关于编码
    */
    // document.cookie = "username='小明\n123'" 无法识别\n所以最好进行编码操作
    document.cookie = "username=" + encodeURI('小刚\n123') //encodeURI进行编码
    console.log(decodeURI(document.cookie) //decodeURI进行解码

    /**
    *   创建保存cookie组件，方便调用：
    */
    function Cookie() {

    }
    Cookie.prototype = {
        setCookie: function (key, value, t) {
            var oDate = new Date()
            oDate.setDate(oDate.getDate() + t)
            document.cookie = key + "=" + encodeURI(value) + ";expires" + oDate.toUTCString()
        },
        getCookie: function (key) {
            var arr = document.cookie.split("; ")

            return this.formatData(arr, key)
        },
        removeCookie: function (key, value, t) {
            this.setCookie(key, value, t)
        },
        formatData: function (arr, key) {
            var prev
            var _this = this
            arr.forEach(function (item, idx) {
                var arr = item.split("=")
                if (arr[0] === key) {
                    // console.log("arr[1]:",decodeURI(arr[1]))
                    prev = decodeURI(arr[1])
                }
            })

            return prev
        }
    }

    var c = new Cookie()
    c.setCookie("username", "小明", 5)
    console.log(c.getCookie("username"))
    c.removeCookie("username", "", -1)
    console.log("remove:", c.getCookie("username"))
</script>