javascript中运用闭包和自执行函数解决大量的全局变量问题


Posted in Javascript onDecember 30, 2010

但是从全局看来,这样会导致出现一些让我们难以掌控的情况的出现:变量同名、多个函数共用一个全局变量后的值的变换……等等。所以,有时候,对于一些简单的全局变量,我们可以通过另一种方式来处理——用自执行函数+闭包的方法来解:

比如:我们要在网页加载时给出一个提示,在网页关闭时给出另一个提示
下面的代码,实现了以上功能

var msg1 = "欢迎光临!"; // 定义一个全局变量 
var msg2 = "再见!" //定了另一个全局变量 
window.onload = function() { 
alert(msg1); 
} 
window.onunload = function() { 

alert(msg2); 
}

这段代码中已经用到了两个全局变量。而只是为了实现一个简小的功能。
而且,全局变量太多,我们必须记住:msg1是欢迎时的变量,msg2是关闭时变量……如果变量更多,我们还能记得住吗?

下面是同样的功能,不过运用了自执行函数+闭包方法:

(function() { 
var msg = "Hello, world!"; 

window.onload = function() { 


alert(msg); 

} 
})(); 
(function() { 

var msg = "Hello, world!"; 

window.onunload = function() { 


alert(msg); 

} 
})();

后者做法,虽然代码增长了,但是:
1)msg变量只在各自的自执行函数内有效。不会和其它全局变量之间产生混淆。
2)代码的结构变得更加的清晰。
3)解决了大量使用全局变量的情况。

以上只是本人的一点认识,希望真正的高手给出点评!

Javascript 相关文章推荐
js继承 Base类的源码解析
Dec 30 Javascript
在网页中使用document.write时遭遇的奇怪问题
Aug 24 Javascript
浅析jquery的js图表组件highcharts
Mar 06 Javascript
深入理解JavaScript系列(46):代码复用模式(推荐篇)详解
Mar 04 Javascript
在浏览器中打开或关闭JavaScript的方法
Jun 03 Javascript
jquery ezUI 双击行记录弹窗查看明细的实现方法
Jun 01 Javascript
一个极为简单的requirejs实现方法
Oct 20 Javascript
学习使用Bootstrap栅格系统
May 11 Javascript
详细讲解vue2+vuex+axios
May 27 Javascript
JavaScript实现的数字与字符串转换功能示例
Aug 23 Javascript
Vue.js 的移动端组件库mint-ui实现无限滚动加载更多的方法
Dec 23 Javascript
详解jQuery获取特殊属性的值以及设置内容
Nov 14 jQuery
javascript中创建对象的三种常用方法
Dec 30 #Javascript
javascript 闭包疑问
Dec 30 #Javascript
javascript数字数组去重复项的实现代码
Dec 30 #Javascript
ExtJs的Date格式字符代码
Dec 30 #Javascript
jcarousellite.js 基于Jquery的图片无缝滚动插件
Dec 30 #Javascript
使用jQuery全局事件ajaxStart为特定请求实现提示效果的代码
Dec 30 #Javascript
在VS2008中使用jQuery智能感应的方法
Dec 30 #Javascript
You might like
php 远程图片保存到本地的函数类
2008/12/08 PHP
PHP 第二节 数据类型之字符串类型
2012/04/28 PHP
PHP彩蛋信息介绍和阻止泄漏的方法(隐藏功能)
2014/08/06 PHP
IE7提供XMLHttpRequest对象为兼容
2007/03/08 Javascript
jquery 图片预加载 自动等比例缩放插件
2008/12/25 Javascript
JavaScript DOM 学习第二章 编辑文本
2010/02/19 Javascript
基于jquery循环map功能的代码
2011/02/26 Javascript
Javascript的数组与字典用法与遍历对象的属性技巧
2012/11/07 Javascript
Javascript图像处理—平滑处理实现原理
2012/12/28 Javascript
NodeJS制作爬虫全过程
2014/12/22 NodeJs
分享一个插件实现水珠自动下落效果
2016/06/01 Javascript
CSS3 media queries结合jQuery实现响应式导航
2016/09/30 Javascript
vue.js路由跳转详解
2017/08/28 Javascript
react实现一个优雅的图片占位模块组件详解
2017/10/30 Javascript
Angular 多模块项目构建过程
2020/02/13 Javascript
JS将指定的某个字符全部转换为其他字符实例代码
2020/10/13 Javascript
python中dir函数用法分析
2015/04/17 Python
基于Python实现定时自动给微信好友发送天气预报
2018/10/25 Python
如何在Django中添加没有微秒的 DateTimeField 属性详解
2019/01/30 Python
解决python3.5 正常安装 却不能直接使用Tkinter包的问题
2019/02/22 Python
python网络应用开发知识点浅析
2019/05/28 Python
Python跳出多重循环的方法示例
2019/07/03 Python
django中SMTP发送邮件配置详解
2019/07/19 Python
Django模型修改及数据迁移实现解析
2019/08/01 Python
python爬虫使用正则爬取网站的实现
2020/08/03 Python
泰国折扣酒店预订:Hotels2Thailand
2018/03/20 全球购物
装饰资料员岗位职责
2013/12/30 职场文书
水电工岗位职责
2014/02/12 职场文书
亲子拓展活动方案
2014/02/20 职场文书
小学六年级学生评语
2014/04/22 职场文书
工作态度不好检讨书
2015/05/06 职场文书
2015年网管个人工作总结
2015/05/22 职场文书
小学六一儿童节活动开幕词
2016/03/04 职场文书
mybatis使用oracle进行添加数据的方法
2021/04/27 Oracle
springboot+VUE实现登录注册
2021/05/27 Vue.js
Python中的matplotlib绘制百分比堆叠柱状图,并为每一个类别设置不同的填充图案
2022/04/20 Python