js闭包用法实例详解
本文实例讲述了js闭包用法。分享给大家供大家参考,具体如下:
引言
在公司中需要写一个js脚本来进行网站的统计,实现类似百度统计或者站长统计的功能,在实现的过程中自己感觉写的代码还是可以的,因为之前的js代码都是这些写,但是在组长代码走查的时候却非常的不满意,因为我们在js中写的方法都是全局的方法,因为我们写的东西需要嵌入到别人的界面中,所以这些全局的东西很可能会和别人的东西重名从而引发错误,所以说组长就给我留下一句话:用js闭包包起来。
变量作用域
我们都非常的熟悉变量的作用域就分为:全局变量和局部变量。js中在函数的内部可以直接读取全局变量。
Js代码
varn=999;
functionf1(){
alert(n);
}
f1();//999
另一方面,在函数外部自然无法读取函数内的局部变量。
Js代码
functionf1(){
varn=999;
}
alert(n);//error
我们还需要注意,在js中如果声明变量的时候一定要用var命令,否则实际上声明了一个全局的变量!
functionf1(){
n=999;
}
f1();
alert(n);//999
如何从外部读取全局变量?
我们需要得到函数内部的全局变量该怎么办呢?。在正常情况下我们是做不到的,要想这么实现我们必须想一些办法——在函数的内部在定义一个函数:
functionf1(){
n=999;
functionf2(){
alert(n);//999
}
}
在上面的代码中,函数f2就被包括在函数f1内部,这时f1内部的所有局部变量,对f2都是可见的。但是反过来就不行,f2内部的局部变量,对f1就是不可见的。这就是JavaScript语言特有的“链式作用域”结构(chainscope),子对象会一级一级地向上寻找所有父对象的变量。所以,父对象的所有变量,对子对象都是可见的,反之则不成立。
既然f2可以读取f1中的局部变量,那么只要把f2作为返回值,我们不就可以在f1外部读取它的内部变量了吗!
functionf1(){
n=999;
functionf2(){
alert(n);
}
returnf2;
}
varresult=f1();
result();//999
闭包的概念
在上面的代码中f2函数,就是闭包。各种专业文献上的“闭包”(closure)定义非常抽象,很难看懂。我的理解是,闭包就是能够读取其他函数内部变量的函数。由于在Javascript语言中,只有函数内部的子函数才能读取局部变量,因此可以把闭包简单理解成“定义在一个函数内部的函数”。所以,在本质上,闭包就是将函数内部和函数外部连接起来的一座桥梁。
下面来分享一下我们在项目中用到的js闭包的写法:
(function(){
functiongetPageTitle(){
returndocument.title;
}
functiongetBrowerLanguage(){
varbrowerLanguage=!navigator.browserLanguage?navigator.language:navigator.browserLanguage;
returnbrowerLanguage;
}
/**
*当前页面地址#后的部分
*/
functiongetLastUrl(){
varurl=window.location.hash;
if(!url){
returnnull;
}
else{
returnurl.toString().split("#")[1];
}
}
functionGetRandomNum(){
vararr=document.cookie.match(newRegExp("(^|)"+"statisticssCookie=([^;]*)(;|$)"));
if(arr!=null){
returnarr[2];
}else{
vartempRandomNum=guid();
document.cookie="statisticssCookie="+tempRandomNum;
returntempRandomNum;
}
}
functionguid(){
functionS4(){
return(((1+Math.random())*0x10000)|0).toString(16).substring(1);
}
return(S4()+S4()+"-"+S4()+"-"+S4()+"-"+S4()+"-"+S4()+S4()+S4());
}
functionaddJs(){
varurl="http://localhost:10086/tongji/tongji/do?title="+getPageTitle()+"&browerLanguage="+getBrowerLanguage()+"&lastUrl="+getLastUrl()+"&upFlag="+GetRandomNum();
varhead=document.getElementsByTagName('head')[0];
varjs=document.createElement('script');
js.type='text/javascript';
js.src=url;
head.appendChild(js);
}
window.statistics=addJs;//将addJs这个方法挂在window下面,这样在外界是可以访问的,否则外界永不能访问到我写的方法
document.ready=addJs();//DOM树加载完成后执行
})(window)
小结
在开始的时候组长就问我会不会js闭包函数,因为如果不会闭包写不出很好的代码。写的代码都非常的粗糙,所以说我们在写代码的时候,不能仅仅满足功能实现,而且需要考虑一些其他方面的东西。当然js闭包在使用的时候也有一些弊端,所以我们在使用的时候也需要综合全面的信息考虑。
更多关于JavaScript相关内容感兴趣的读者可查看本站专题:《JavaScript数据结构与算法技巧总结》、《JavaScript数学运算用法总结》、《JavaScript切换特效与技巧总结》、《JavaScript查找算法技巧总结》、《JavaScript错误与调试技巧总结》及《JavaScript遍历算法与技巧总结》
希望本文所述对大家JavaScript程序设计有所帮助。