javaScript中的几种缓存的对比和我的理解

从实用性出发，用事实说话。

三种最常用的缓存方式：cookie,sessionStorage,localStorage
一、cookie
最常用于与服务端通信的时候一些数据缓存，可以设置失效的时间，但是大小不是很大大约4k左右。
document.cookie(name=value;expires=date);
一般来说都会自己封装一个获取，删除，修改cookie的方法。
要注意的是上面设置的有效时间使用的是 toUTCString();
设置cookie：
function setCookie(n,v,t){
        const time=new Date();
        time.setDate(time.getDate()+t);
        time.toUTCString();
        document.cookie=''+n+'='+v+';expires='+time+''
}
获取cookie：
function getCookie(n) {
        const c=document.cookie;
        const b=c.split(';');
        let v='';
        for(let i of b){
            if(i.indexOf(n)>-1){
                v=i.split('=')[1]
            }
        }
        return v
}
删除cookie：
 function delCookie(n) {
        document.cookie = '' + n + '="";expires=-1'
}
二、sessionStorage();
页面关闭，窗口关闭则缓存清除，不能长期存在，大小上等同localStorage。一般5M左右。
设置：
    sessionStorage.setItem('tnd',arr1);
    sessionStorage.getItem('tnd');
    sessionStorage.clear(); //全部清除，
    或者sessionStorage.setItem('tnd','')

三、localStorage();
使用方法如上一样，这个设置的时效性是永久的。
    localStorage.setItem('tnd',arr1)
    localStorage.getItem('tnd')
    localStorage.setItem('tnd','')