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 flash激活
Oct 19 Javascript
javascript window.opener的用法分析
Apr 07 Javascript
JavaScript高级程序设计(第3版)学习笔记9 js函数(下)
Oct 11 Javascript
JavaScript设置body高度为浏览器高度的方法
Feb 09 Javascript
JavaScript实现多个重叠层点击切换效果的方法
Apr 24 Javascript
文字垂直滚动之javascript代码
Jul 29 Javascript
js仿QQ邮箱收件人选择与搜索功能
Feb 10 Javascript
在百度搜索结果中去除掉一些网站的资料(通过js控制不让显示)
May 02 Javascript
尝试自己动手用react来写一个分页组件(小结)
Feb 09 Javascript
微信小程序画布圆形进度条显示效果
Nov 17 Javascript
详解element-ui设置下拉选择切换必填和非必填
Jun 17 Javascript
详解搭建一个vue-cli的移动端H5开发模板
Jan 17 Javascript
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学习笔记之二
2011/01/17 PHP
php异步多线程swoole用法实例
2014/11/14 PHP
Laravel Intervention/image图片处理扩展包的安装、使用与可能遇到的坑详解
2017/11/14 PHP
smarty模板的使用方法实例分析
2019/09/18 PHP
js创建元素(节点)示例
2014/01/02 Javascript
php的文件上传入门教程(实例讲解)
2014/04/10 Javascript
BootstrapTable+KnockoutJS自定义T4模板快速生成增删改查页面
2016/08/01 Javascript
利用JavaScript判断浏览器类型及版本
2016/08/23 Javascript
基于Marquee.js插件实现的跑马灯效果示例
2017/01/25 Javascript
详细AngularJs4的图片剪裁组件的实例
2017/07/12 Javascript
React Native 图片查看组件的方法
2018/03/01 Javascript
node.js之基础加密算法模块crypto详解
2018/09/11 Javascript
js实现无缝轮播图效果
2020/03/09 Javascript
[01:33:07]VGJ.T vs Newbee Supermajor 败者组 BO3 第一场 6.6
2018/06/07 DOTA
web.py在SAE中的Session问题解决方法(使用mysql存储)
2015/06/24 Python
Python使用sqlalchemy模块连接数据库操作示例
2019/03/13 Python
Python 下载及安装详细步骤
2019/11/04 Python
解决TensorFlow模型恢复报错的问题
2020/02/06 Python
Python字符串格式化常用手段及注意事项
2020/06/17 Python
解决keras backend 越跑越慢问题
2020/06/18 Python
解决python中0x80072ee2错误的方法
2020/07/19 Python
Python 将代码转换为可执行文件脱离python环境运行(步骤详解)
2021/01/25 Python
使用CSS3的背景渐变Text Gradient 创建文字颜色渐变
2014/08/19 HTML / CSS
用css3写出气球样式的示例代码
2017/09/11 HTML / CSS
纽约的奢华内衣店:Journelle
2016/07/29 全球购物
师范生教师实习自我鉴定
2013/09/27 职场文书
大专生找工作自荐书
2014/06/10 职场文书
乡镇爱国卫生月活动总结
2014/06/25 职场文书
岗位安全生产责任书
2014/07/28 职场文书
幼儿教师小班个人总结
2015/02/05 职场文书
售后前台接待岗位职责
2015/04/03 职场文书
研讨会通知
2015/04/27 职场文书
公司催款律师函
2015/05/27 职场文书
话题作文之关于呼唤
2019/11/29 职场文书
详解Java实践之抽象工厂模式
2021/06/18 Java/Android
《吸血鬼幸存者》新内容发布 追加多个全新模式
2022/04/07 其他游戏