cookie和localStorage 的区别与运用

cookie 存储

//cookies
//cookies 有大小限制，大概4kb  数量 在30~50个左右
//cookies 可以在请求时携带，后端也可以主动给客户端设置
//用途：可以用作登录凭证的标识

console.log(document.cookie);
			
function setCookie(name,value,Days){
     var exp = new Date(); 
     exp.setTime(exp.getTime() + Days*24*60*60*1000);
     document.cookie = name + "="+ escape(value) + ";expires=" + exp.toGMTString(); 
 }
	
function getCookie(name){
	var arr,reg = new RegExp("(^|)"+name+"=([^;]*)(;|$)");
	return (arr=document.cookie.match(reg))?unescape(arr[2]):null;
}

localStorage 本地存储

//永久保存    上限5M
var color = ["red","blue","green"];
localStorage.setItem("color",JSON.stringify(color));
//读取
var ls = localStorage.getItem("color");
console.log(JSON.parse(ls));

//清除
localStorage.removeItem("color");

//sessionStorage  会话存储器
//只要当前标签页没有关闭，都会一直保存
var num = [1,2,3];

sessionStorage

//sessionStorage  会话存储器
//只要当前标签页没有关闭，都会一直保存
//存储
sessionStorage.setItem("num",JSON.stringify(num));
//读取
var ss = sessionStorage.getItem("num");
console.log(JSON.parse(ss));
//清除
sessionStorage.removeItem("num");