这里有新鲜出炉的 Javascript 教程,程序狗速度看过来!
Javascript 是一种由 Netscape 的 LiveScript 发展而来的原型化继承的基于对象的动态类型的区分大小写的客户端脚本语言,主要目的是为了解决服务器端语言,比如 Perl,遗留的速度问题,为客户提供更流畅的浏览效果。
这篇文章主要介绍了 js 闭包用法, 结合实例形式分析了 JS 闭包的概念、功能及相关操作技巧, 需要的朋友可以参考下
本文实例讲述了 js 闭包用法。分享给大家供大家参考,具体如下:
引言
在公司中需要写一个 js 脚本来进行网站的统计,实现类似百度统计或者站长统计的功能,在实现的过程中自己感觉写的代码还是可以的,因为之前的 js 代码都是这些写,但是在组长代码走查的时候却非常的不满意,因为我们在 js 中写的方法都是全局的方法,因为我们写的东西需要嵌入到别人的界面中,所以这些全局的东西很可能会和别人的东西重名从而引发错误,所以说组长就给我留下一句话:用 js 闭包包起来。
变量作用域
我们都非常的熟悉变量的作用域就分为:全局变量和局部变量。js 中在函数的内部可以直接读取全局变量。
Js 代码
- var n=999;
- function f1(){
- alert(n);
- }
- f1(); // 999
另一方面,在函数外部自然无法读取函数内的局部变量。
Js 代码
- function f1(){
- var n=999;
- }
- alert(n); // error
我们还需要注意,在 js 中如果声明变量的时候一定要用 var 命令,否则实际上声明了一个全局的变量!
- function f1(){
- n=999;
- }
- f1();
- alert(n); // 999
如何从外部读取全局变量?
我们需要得到函数内部的全局变量该怎么办呢?。在正常情况下我们是做不到的,要想这么实现我们必须想一些办法——在函数的内部在定义一个函数:
- function f1(){
- n=999;
- function f2(){
- alert(n); // 999
- }
- }
在上面的代码中,函数 f2 就被包括在函数 f1 内部,这时 f1 内部的所有局部变量,对 f2 都是可见的。但是反过来就不行,f2 内部的局部变量,对 f1 就是不可见的。这就是 JavaScript 语言特有的 "链式作用域" 结构(chain scope),子对象会一级一级地向上寻找所有父对象的变量。所以,父对象的所有变量,对子对象都是可见的,反之则不成立。
既然 f2 可以读取 f1 中的局部变量,那么只要把 f2 作为返回值,我们不就可以在 f1 外部读取它的内部变量了吗!
- function f1(){
- n=999;
- function f2(){
- alert(n);
- }
- return f2;
- }
- var result=f1();
- result(); // 999
闭包的概念
在上面的代码中 f2 函数,就是闭包。各种专业文献上的 "闭包"(closure)定义非常抽象,很难看懂。我的理解是,闭包就是能够读取其他函数内部变量的函数。由于在 Javascript 语言中,只有函数内部的子函数才能读取局部变量,因此可以把闭包简单理解成 "定义在一个函数内部的函数"。所以,在本质上,闭包就是将函数内部和函数外部连接起来的一座桥梁。
下面来分享一下我们在项目中用到的 js 闭包的写法:
- (function () {
- function getPageTitle() {
- return document.title;
- }
- function getBrowerLanguage() {
- var browerLanguage = !navigator.browserLanguage ? navigator.language : navigator.browserLanguage;
- return browerLanguage;
- }
- /**
- * 当前页面地址#后的部分
- */
- function getLastUrl() {
- var url = window.location.hash;
- if (!url) {
- return null;
- }
- else {
- return url.toString().split("#")[1];
- }
- }
- function GetRandomNum() {
- var arr = document.cookie.match(new RegExp("(^| )" + "statistiCSSCookie=([^;]*)(;|$)"));
- if (arr != null) {
- return arr[2];
- } else {
- var tempRandomNum = guid();
- document.cookie = "statisticssCookie = " + tempRandomNum;
- return tempRandomNum;
- }
- }
- function guid() {
- function S4() {
- return (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1);
- }
- return (S4() + S4() + "-" + S4() + "-" + S4() + "-" + S4() + "-" + S4() + S4() + S4());
- }
- function addJs() {
- var url = "http://localhost:10086/tongji/tongji/do?title=" + getPageTitle() + "&browerLanguage=" + getBrowerLanguage() + "&lastUrl=" + getLastUrl() + "&upFlag=" + GetRandomNum();
- var head = document.getElementsByTagName('head')[0];
- var js = 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 程序设计有所帮助。
来源: http://www.phperz.com/article/17/0516/329619.html