9)使用面向对象思想处理cookie
JavaScript中的Math对象的功能,其实就是通过Math这个全局对象,把所有的数学计算相关的常量和方法都联系到一起,作为一个整体使用,提高了封装性和使用效率.
cookie的处理也可以按照这种方法来进行.
1)需求分析
对于cookie的处理,事实上只是封装一些方法,每个对象不会有状态,所以不需要创建一个cookie处理类,而只需用一个全局对象来联系这些cookie操作.对象名可以理解为命名空间.
对cookie经常有以下操作:
1>设置cookie:包括了添加和修改功能.(事实上如果原有cookie名称已经存在,那添加此cookie就相当于修改了此cookie.)在设置cookie的时候还会有一些可选项,用于指定cookie的声明周期\访问路径以及访问域.为了让cookie能存储中文,还需要为存储的值进行编码.
2>删除一个cookie:删除cookie只需将一个cookie的过期事件设置为过去的一个时间即可.它接收一个cookie的名称为参数,从而删除此cookie.
3>取一个cookie的值:该方法接收cookie名称为参数,返回该cookie的值.因为在存储该值的时候已经进行了编码,所以取值时应自动解码,然后返回.
2)创建cookie对象
因为是作为类名或命名空间的作用,所以和Math对象类似,这里使用Cookie来表示该对象:
var Cookie = new Object();
3)实现设置cookie的方法
方法:setCookie(name,value,option); --name:cookie名称; value--cookie值; option包括了其他选项.
实现如下:
4)实现取cookie值方法
方法:getCookie(name); --name:cookie名称
实现如下:
5)实现删除Cookie方法
方法:deleteCookie(name); --name:cookie名称.
实现原理:通过调用setCookie完成,将option的expireDays属性值设置为负数即可.
实现如下:
通过下面的代码,整个Cookie对象创建完毕后,可以将其放到一个大括号中来定义,例如:
cookie的处理也可以按照这种方法来进行.
1)需求分析
对于cookie的处理,事实上只是封装一些方法,每个对象不会有状态,所以不需要创建一个cookie处理类,而只需用一个全局对象来联系这些cookie操作.对象名可以理解为命名空间.
对cookie经常有以下操作:
1>设置cookie:包括了添加和修改功能.(事实上如果原有cookie名称已经存在,那添加此cookie就相当于修改了此cookie.)在设置cookie的时候还会有一些可选项,用于指定cookie的声明周期\访问路径以及访问域.为了让cookie能存储中文,还需要为存储的值进行编码.
2>删除一个cookie:删除cookie只需将一个cookie的过期事件设置为过去的一个时间即可.它接收一个cookie的名称为参数,从而删除此cookie.
3>取一个cookie的值:该方法接收cookie名称为参数,返回该cookie的值.因为在存储该值的时候已经进行了编码,所以取值时应自动解码,然后返回.
2)创建cookie对象
因为是作为类名或命名空间的作用,所以和Math对象类似,这里使用Cookie来表示该对象:
var Cookie = new Object();
3)实现设置cookie的方法
方法:setCookie(name,value,option); --name:cookie名称; value--cookie值; option包括了其他选项.
实现如下:
Cookie.setCookie=function(name,value,option){
//用于存储赋值给document.cookie的cookie格式字符串
var str=name+"="+escape(value);
if(option){
//如果设置了过期时间
if(option.expireDays){
var date=new Date();
var ms=option.expireDays*24*3600*1000;
date.setTime(date.getTime()+ms);
str+="; expires="+date.toGMTString();
}
if(option.path)str+="; path="+path; //设置访问路径
if(option.domain)str+="; domain"+domain; //设置访问主机
if(option.secure)str+="; true"; //设置安全性
}
document.cookie=str;
}
//用于存储赋值给document.cookie的cookie格式字符串
var str=name+"="+escape(value);
if(option){
//如果设置了过期时间
if(option.expireDays){
var date=new Date();
var ms=option.expireDays*24*3600*1000;
date.setTime(date.getTime()+ms);
str+="; expires="+date.toGMTString();
}
if(option.path)str+="; path="+path; //设置访问路径
if(option.domain)str+="; domain"+domain; //设置访问主机
if(option.secure)str+="; true"; //设置安全性
}
document.cookie=str;
}
4)实现取cookie值方法
方法:getCookie(name); --name:cookie名称
实现如下:
Cookie.getCookie=function(name){
var cookieArray=document.cookie.split("; "); //得到分割的cookie名值对
var cookie=new Object();
for(var i=0;i<cookieArray.length;i++){
var arr=cookieArray[i].split("="); //将名和值分开
if(arr[0]==name)return unescape(arr[1]); //如果是指定的cookie,则返回它的值
}
return "";
}
var cookieArray=document.cookie.split("; "); //得到分割的cookie名值对
var cookie=new Object();
for(var i=0;i<cookieArray.length;i++){
var arr=cookieArray[i].split("="); //将名和值分开
if(arr[0]==name)return unescape(arr[1]); //如果是指定的cookie,则返回它的值
}
return "";
}
5)实现删除Cookie方法
方法:deleteCookie(name); --name:cookie名称.
实现原理:通过调用setCookie完成,将option的expireDays属性值设置为负数即可.
实现如下:
Cookie.deleteCookie=function(name){
this.setCookie(name,"",{expireDays:-1}); //将过期时间设置为过去来删除一个cookie
}
this.setCookie(name,"",{expireDays:-1}); //将过期时间设置为过去来删除一个cookie
}
通过下面的代码,整个Cookie对象创建完毕后,可以将其放到一个大括号中来定义,例如:
var Cookie={
setCookie:function(){},
getCookie:function(){},
deleteCookie:function(){}
}
这样让Cookie对象的功能更清晰,它作为一个全局对象,大大方便了对Cookie的操作,例如:setCookie:function(){},
getCookie:function(){},
deleteCookie:function(){}
}
Cookie.setCookie("user","jack");
alert(Cookie.getCookie("user"));
Cookie.deleteCookie("user");
alert(Cookie.getCookie("user"));
本节通过建立一个Cookie对象来处理cookie,方便了操作,也体现了面向对象的编程思想:把相关的功能封装在一个
对象中。考虑到JavaScript语言的特点,本章没有选择需要创建类的面向对象编程的例子,那和一般面向对象语言没有大的不同。而是以
JavaScript中可以直接创建对象为特点介绍了Cookie对象的实现及其工作原理。事实上这也和JavaScript内部对象Math的工作原理
是类似的。alert(Cookie.getCookie("user"));
Cookie.deleteCookie("user");
alert(Cookie.getCookie("user"));