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 相关文章推荐
document节点对象的获取方式示例介绍
Dec 24 Javascript
jQuery添加/改变/移除CSS类及判断是否已经存在CSS
Aug 20 Javascript
js中实现多态采用和继承类似的方法
Aug 22 Javascript
jQuery动态星级评分效果实现方法
Aug 06 Javascript
js动态生成Html元素实现Post操作(createElement)
Sep 14 Javascript
javascript每日必学之运算符
Feb 16 Javascript
关于jquery中动态增加select,事件无效的快速解决方法
Aug 29 Javascript
JQuery实现DIV其他动画效果的简单实例
Sep 18 Javascript
JavaScript登录验证基础教程
Nov 01 Javascript
Vue 中的compile操作方法
Feb 26 Javascript
vue使用监听实现全选反选功能
Jul 06 Javascript
详解基于Vue/React项目的移动端适配方案
Aug 23 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
经典的星际争霸,满是回忆的BGM
2020/04/09 星际争霸
学习使用curl采集curl使用方法
2012/01/11 PHP
Yii2.0 模态弹出框+ajax提交表单
2016/05/22 PHP
Laravel构建即时应用的一种实现方法详解
2017/08/31 PHP
php命令行模式代码实例详解
2021/02/26 PHP
JavaScript Ajax Json实现上下级下拉框联动效果实例代码
2013/11/23 Javascript
关闭浏览器时提示onbeforeunload事件
2013/12/25 Javascript
jQuery仿淘宝网产品品牌隐藏与显示效果
2015/09/01 Javascript
swiper自定义分页器使用方法详解
2020/09/14 Javascript
javascript高仿热血传奇游戏实现代码
2018/02/22 Javascript
JavaScript 五大常见函数
2018/03/23 Javascript
JS判断字符串是否为整数的方法--简单的正则判断
2018/07/23 Javascript
使用Angular Cli如何创建Angular私有库详解
2019/01/30 Javascript
vue滚动固定顶部及修改样式的实例代码
2019/05/30 Javascript
vue项目中使用AES实现密码加密解密(ECB和CBC两种模式)
2019/08/12 Javascript
浅谈TypeScript 用 Webpack/ts-node 运行的配置记录
2019/10/11 Javascript
[56:57]LGD vs VP 2019DOTA2国际邀请赛淘汰赛 胜者组赛BO3 第一场 8.20.mp4
2019/08/22 DOTA
Python3实现将文件树中所有文件和子目录归档到tar压缩文件的方法
2015/05/22 Python
python制作花瓣网美女图片爬虫
2015/10/28 Python
Python实现将罗马数字转换成普通阿拉伯数字的方法
2017/04/19 Python
python3中获取文件当前绝对路径的两种方法
2018/04/26 Python
Python http接口自动化测试框架实现方法示例
2018/12/06 Python
详解Python连接MySQL数据库的多种方式
2019/04/16 Python
python sorted函数的小练习及解答
2019/09/18 Python
Python 类方法和实例方法(@classmethod),静态方法(@staticmethod)原理与用法分析
2019/09/20 Python
python实现两个字典合并,两个list合并
2019/12/02 Python
python异常处理try except过程解析
2020/02/03 Python
python图形开发GUI库wxpython使用方法详解
2020/02/14 Python
Django 后台带有字典的列表数据与页面js交互实例
2020/04/03 Python
Gibson London官网:以地道的英国男装而著称
2019/12/06 全球购物
什么是SCM(软件配置管理)
2014/08/16 面试题
国际政治个人自荐信范文
2013/11/26 职场文书
高中学生干部学习的自我评价
2014/02/21 职场文书
西安导游词
2015/02/12 职场文书
使用redis实现延迟通知功能(Redis过期键通知)
2021/09/04 Redis
vue中data里面的数据相互使用方式
2022/06/05 Vue.js