JavaScript对Cookie操作的封装小结
2023-06-13 09:14:15 时间
Javascript没有private,public访问权限设置的关键字,但是可以通过一定的技巧来模拟出相同的结果.
首先我们来看下面一行代码:
vari=(1,2,3,4,5);
变量i最后的结果为5.
这是逗号操作符的结果,也就是说返回最后的一个值,小括号改变了这行代码的优先级,否则vari=1,2,3,4,5;会报错缺少标识符.
vari=(1,2,3,4,function(){return5*5;});
变量i最后的结果为一个函数,返回结果25.
这就是Javascript的灵活之处,能够赋值任意类型而不必提前声明.现在我们完全可以进行如下调用:
i();
alert(i());
来获得返回25的一次方法调用.
我们继续,变量i是通过赋值符来获取函数的引用的,也就是说在等号右边的小括号运算完后返回的最后一个结果的引用还在,虽然我们无法显示调用,但它确实存在,如果要不通过变量的引用而调用呢?
(1,2,3,4,function(){alert(5*5);})()
上面的代码执行后,弹出一个消息框,显示25.
为了显示方便,我将上个例子的函数改为弹出消息框了.
两对小括号()();前面一对表示返回一个结果,如果该结果为一个函数,由第二对小括号发生调用.
也就是通过前面一对括号发生匿名函数的引用,以便在下面进行引用.这就是对匿名函数的调用.
关于更多匿名函数的使用可以参考文尾的引用连接.
闭包产生的原因是因为作用域的不同,子作用域引用了父作用域的变量,而返回子作用域,父作用域按理来说执行完毕后该销毁掉了,只是子作用域一直存在,且一直握有父作用域的引用,所以才一直保留.
来看下面的代码
复制代码代码如下:
首先我们来看下面一行代码:
vari=(1,2,3,4,5);
变量i最后的结果为5.
这是逗号操作符的结果,也就是说返回最后的一个值,小括号改变了这行代码的优先级,否则vari=1,2,3,4,5;会报错缺少标识符.
vari=(1,2,3,4,function(){return5*5;});
变量i最后的结果为一个函数,返回结果25.
这就是Javascript的灵活之处,能够赋值任意类型而不必提前声明.现在我们完全可以进行如下调用:
i();
alert(i());
来获得返回25的一次方法调用.
我们继续,变量i是通过赋值符来获取函数的引用的,也就是说在等号右边的小括号运算完后返回的最后一个结果的引用还在,虽然我们无法显示调用,但它确实存在,如果要不通过变量的引用而调用呢?
(1,2,3,4,function(){alert(5*5);})()
上面的代码执行后,弹出一个消息框,显示25.
为了显示方便,我将上个例子的函数改为弹出消息框了.
两对小括号()();前面一对表示返回一个结果,如果该结果为一个函数,由第二对小括号发生调用.
也就是通过前面一对括号发生匿名函数的引用,以便在下面进行引用.这就是对匿名函数的调用.
关于更多匿名函数的使用可以参考文尾的引用连接.
闭包产生的原因是因为作用域的不同,子作用域引用了父作用域的变量,而返回子作用域,父作用域按理来说执行完毕后该销毁掉了,只是子作用域一直存在,且一直握有父作用域的引用,所以才一直保留.
来看下面的代码
functionparent(){
vara=1;
functionchild(){
varb=2;
alert(a);
alert(b);
}
}
父函数parent中包含了一个child子函数,在子函数中有一个对父函数中a变量的引用(输出其值).
我们来让父函数执行完后返回其声明的子函数
functionparent(){
vara=1;
functionchild(){
varb=2;
alert(a);
alert(b);
}
returnchild;
}
vart=parent();
t();
在10行中,我们执行了parent函数,返回了在函数内部声明的函数child,这时变量t持有该返回对象(此时是一个可以执行的函数)的引用,在11行代码中我们调用了它.结果分别输出了1和2.
注意,输出2,是因为我们在子函数体内声明了一个变量,而输出1,我们在该函数体内并没有相应的定义变量a,而是发生了对父函数里的变量的引用,也就是说引用了父作用域的变量.
而此时又能能够完成输出的,也就是说变量a还存在.可是我们无法直接对其引用(比如parent.a),因为函数已经执行完毕,没有了其相应的引用,我们只能通过所返回的子函数的引用来进行访问.
假如我又在父函数中声明了其他的变量呢?结果是一样的,子函数能够访问,而如果子函数并不返回相应的引用的话,我们根本无法从外部访问到.这就形成了闭包.
闭包能够干些什么呢?如果你有一个不想让外部随意修改的变量该怎么做?那就去使用闭包.
myObj={};//声明一个全局变量,它是一个window对象的属性(window.myObj)
(function(){
vari=4;
myObj={//引用全局变量,对其进行赋值
getI:function(){//get方法,一个函数
returni;
},
setI:function(val){//set方法,限制值的设定
if(val>100){
alert("iconnt>100");
return;
}
i=val;
}
}
})();//匿名函数的调用,由于也是一个函数,所以作为一个子作用域,在执行完之后销毁,避免代码污染
myObj.setI(5);//成功
myObj.setI(101);//失败
alert(myObj.getI());
alert(myObj.i);//错误,没有该属性
至此我们简单的实现了public访问权限以及private访问权限(也就给你想给你的,不给你不想给你的)
在页面中,我们通常使用document.cookie属性来访问,对其赋新值就会创建一个新的Cookie,一个Cookie通常具有五个属性:value(存储的值),date(UTC格式的时间,代表什么时间过期,domain(域,Cookie的所有者),Path(子目录).
而在平常的开发中,如果仅仅使用document.cookie属性进行访问,会很麻烦,因为只能向其赋值字符串,并且在读取后还要进行字符串切割,才能获取指定变量名称的值.document.cookie读取时,返回的是所有赋值的值,而不包括过期时间,域之类的信息,只能再次独设置.
下面就附上代码,全部封装到Cookie全局对象中,暴露出几个方法.
Get:放回指定所有cookie字符串.
Set:设置cookie字符串.
Clear:清除所有cookie对象.
GetDayTime:获取指定距今val天的Date对象.
Write:写cookie.已重载.详见代码.
Query:查询cookie.已重载.详见代码.
Update:修改cookie.
Delete:删除cookie.
代码1-7
Cookie={};
/*
*Date对象的setTime方法是设置距离1970-01-01以来的毫秒数,设置到对象里去,返回的是据那以后的毫秒数而不是原对象.
*如果Cookie不设置expires属性,或者expires时间比本地时间少,那么将会在下一次浏览时过期.
*document.cookie对象返回的是所有值的字符串形式,不包含expires或者其他.
*
*/
(function(){
varnDay=24*60*60*1000;
varisString=function(v){
returntypeofv==="string";
}
varisArray=function(v){
returnObject.prototype.toString.apply(v)=="[objectArray]";
}
varisObject=function(v){
returnv&&typeofv=="object";
}
varisDate=function(v){
returnObject.prototype.toString.apply(v)=="[objectDate]";
}
vargetTime=function(){
returnnewDate().getTime();
}
vartrim=function(val){
return(val||"").replace(/^\s+|\s+$/g,"");
}
vartryEval=function(val){
varObj,e;
try{
Obj=eval(val);
}catch(e){
Obj=val;
}
returnObj;
}
varObjectToString=function(o){
vartstr="{";
for(varvino){
if(isArray(o[v])){
tstr+=v+":"+ArrayToString(o[v])+",";
}elseif(isObject(o[v])){
tstr+=v+":"+ObjectToString(o[v])+",";
}elseif(isString(o[v])){
tstr+=v+":\""+o[v].toString()+"\",";
}else{
tstr+=v+":"+o[v].toString()+",";
}
}
returntstr.slice(0,-1)+"}";
}
varArrayToString=function(o){
vartstr="[";
for(varvino){
if(isArray(o[v])){
tstr+=ArrayToString(o[v])+",";
}elseif(isObject(o[v])){
tstr+=ObjectToString(o[v])+",";
}else{
tstr+=o[v].toString()+",";
}
}
returntstr.slice(0,-1)+"]";;
}
Cookie={
Get:function(){
returndocument.cookie;
},
Set:function(val){
document.cookie=val;
},
Clear:function(){
vartemp=this.Query();
varo;
for(ointemp){
this.Delete(o);
}
},
GetDayTime:function(val){
vartexpires=newDate();
texpires.setTime(texpires.getTime()+val*nDay);
returntexpires;
},
Write:function(){
/*
*Cookie.Write(Object);写入对象,名称为main;
*Cookie.Write(varname,Object);varname:变量名,Object:写入对象;
*Cookie.Write(Object,Date);Object:写入对象,Date:过期时间;
*Cookie.Write(varname,Object,Date);varname:变量名,Object:写入对象,Date:过期时间;
*Cookie.Write(varname,Object,Date,Domain,Path);varname:变量名,Object:写入对象,Date:过期时间,Domain:域,Path:子目录;
*/
if(arguments.length==1){
vartvalue=arguments[0];
vartstr="";
vartexpires=newDate();texpires.setTime(texpires.getTime()+1*nDay);
if(isArray(tvalue)){
tstr=ArrayToString(tvalue);
}elseif(isObject(tvalue)){
tstr=ObjectToString(tvalue);
}else{
tstr=tvalue.toString();
}
tstr="main="+escape(tstr)+";expires="+texpires.toGMTString()+";";
}elseif(arguments.length==2){
vartname,tvalue,texpires,tstr="";
if(isDate(arguments[1])){
tname="main";
tvalue=arguments[0];
texpires=arguments[1];
}else{
tname=arguments[0];
tvalue=arguments[1];
texpires=newDate();texpires.setTime(texpires.getTime()+1*nDay);
}
if(isArray(tvalue)){
tstr+=ArrayToString(tvalue);
}elseif(isObject(tvalue)){
tstr+=ObjectToString(tvalue);
}else{
tstr=tvalue.toString();
}
tstr=tname+"="+escape(tvalue)+";expires="+texpires.toGMTString()+";";
}elseif(arguments.length==3){
vartname=arguments[0],tvalue=arguments[1],texpires=arguments[2],tstr="";
if(isArray(tvalue)){
tstr=ArrayToString(tvalue);
}elseif(isObject(tvalue)){
tstr=ObjectToString(tvalue);
}else{
tstr=tvalue.toString();
}
tstr=tname+"="+escape(tvalue)+";expires="+texpires.toGMTString()+";";
}elseif(arguments.length==5){
vartname=arguments[0],tvalue=arguments[1],texpires=arguments[2],tdomain=arguments[3],tpath=arguments[4],tstr="";
if(isArray(tvalue)){
tstr=ArrayToString(tvalue);
}elseif(isObject(tvalue)){
tstr=ObjectToString(tvalue);
}else{
tstr=tvalue.toString();
}
tstr=tname+"="+escape(tvalue)+";expires="+texpires.toGMTString()+";domain="+tdomain+";path="+tpath+";";
}
alert(tstr);
this.Set(tstr);
},
Query:function(){
/*
*Cookie.Query();返回所有Cookie值组成的Object;
*Cookie.Query(string);返回指定名称的Object;失败则返回undefined;
*Cookie.Query(string,Object);为指定对象写入指定名称的Object,并返回;失败则返回undefined;
*/
vartname=tvalue="",tright=-1;
vartstr=this.Get();
vartObj={};
if(arguments.length==0){
vari=0;
do{
tname=trim(tstr.slice(i,tstr.indexOf("=",i)));
tright=tstr.indexOf(";",i);
if(tright==-1){
tvalue=unescape(tstr.slice(tstr.indexOf("=",i)+1,tstr.length));
}else{
tvalue=unescape(tstr.slice(tstr.indexOf("=",i)+1,tright));
}
tObj[tname]=tryEval(tvalue);
i=tstr.indexOf(";",i)==-1?-1:tstr.indexOf(";",i)+1;
}while(i!=-1);
}else{
tname=arguments[0];
if(tstr.indexOf(tname)==-1)returnundefined;
vari=tstr.indexOf(tname);
tname=trim(tstr.slice(i,tstr.indexOf("=",i)));
tright=tstr.indexOf(";",tstr.indexOf(tname))==-1?tstr.length:tstr.indexOf(";",tstr.indexOf(tname));
tvalue=unescape(tstr.slice(tstr.indexOf(tname)+tname.length+1,tright));
if(arguments.length==1){
tObj=tryEval(tvalue);
}elseif(arguments.length==2){
tObj=arguments[1];
tObj[tname]=tryEval(tvalue);
}
}
returntObj;
},
Update:function(){
returnthis.Write.apply(this,arguments);
},
Delete:function(){
if(arguments.length==1){
varvarname=arguments[0];
if(this.Query(varname)){
this.Update(varname,"",newDate(1970,01,01));
}
}
}
}
其中有一个从字符串eval成对象的执行,以及从Object或者Array对象获得对应字符串形式的功能函数,模拟了一些JSON的操作.当然,并不能存储所有的JavaScript对象,仅仅满足一部分,我已经感觉够用了.
个人理解有限,请各位多多指教.
Javascript的匿名函数:
Javascript的闭包:
Cookie文件的格式:
相关文章
- 常用的前端JavaScript方法封装
- 消除 JavaScript 的一些“异味”
- JavaScript之无题之让人烦躁的模块化
- JavaScript——动画函数封装
- JavaScript 对象
- self hosted private support chat software use JavaScript remove HTML tags
- 一些常用的Javascript函数
- javascript基于jQuery的表格悬停变色/恢复,表格点击变色/恢复,点击行选Checkbox
- Jquery作者JohnResig自己封装的javascript常用函数
- javascript新闻列表排序简单封装
- Javascript学习笔记1数据类型
- javascript自执行函数之伪命名空间封装法
- Javascript中正则表达式的全局匹配模式分析
- javascript全局变量封装模块实现代码
- JavaScript实现表格排序方法
- JavaScript获取路径设计源码
- JavaScript异步回调的Promise模式封装实例
- 自己封装的javascript事件队列函数版
- javascript面向对象封装与继承
- Javascript模拟加速运动与减速运动代码分享
- JavaScript中伪协议javascript:使用探讨
- JavaScript中的Primitive对象封装介绍
- Javascript基础教程之JavaScript语法