javascript,jquery闭包概念分析


Posted in Javascript onJune 19, 2010

但javascript我是经常要用,所以是要懂这里面的概念。
其实javascript里的闭包概念很简单,就是函数用到外部变量,不需要传参就可以获取。
举个例子:

<script> 
var sMessage = "Hello world"; 
function sayHello(){ 
alert(sMessage); 
} 
sayHello(); 
addNumber(1,2); var iBaseNum = 10; 
function addNumber(iNum1, iNum2) { 
function doAddition() { 
alert(iNum1 + iNum2 + iBaseNum); 
} 
return doAddition(); 
} 
function a(){ 
var i=0; 
function b(){ 
alert(++i); 
} 
return b; 
} 
var c = a(); 
c(); 
c(); 
</script>

第一个函数sayHello没有传参数,直接利用了sMessage变量,这个就叫做闭包。
第二个函数复杂点,里面有个doAddition也是闭包函数,他不需要参数,直接在执行环境中获取iNum1,iNum2,还有外部变量 iBaseNum。
第三个函数 是能保护 i变量的访问,并且一直保存i在内存中,可以一直增加。(闭包的一个经典用法)
jquery中闭包也差不多,先给个例子

你也许会问

(function($){ 
$("div p").click(function(){alert("cssrain!")}); 
})(jQuery); //一个闭包

这是什么写法啊?
别急,我也是请教了upc ,才稍微懂了点。
这里面的$只是形参,但jquery是全局变量,所以不需要调用该函数就会自动执行,或者分两步
就是转化成正常的函数,先写函数,后调用。
如下所示
其实:
(function($){ 
$("div p").click(。。。); 
})(jQuery);

就是等于
function tempFunction($){ //创建一个以$为形参的函数 
$("div p").click(....); 
} 
TempFunction(jQuery); //传入实参jQuery执行函数.

干脆直接这么写 ,算了
(function(cssrain){ 
cssrain("div p").click(.... ); 
})(jQuery); //一个闭包

闭包的基本写法:
(function(){do someting})();
//这个你就理解为定义一个匿名函数并立即执行
带参数的话就这样:
(function(形参){do someting})(实参);
另外
(function(){var upc="i am upc"})();
alert(upc);
会提示undefined。
因为闭包后,里面的变量就相当于局部了。
闭包的好处:
不增加额外的全局变量,
执行过程中所有变量都是在匿名函数内部。
上面的例子不是很好,跟javascript的闭包有点混淆,但这确实也是jquery中的一种闭包。只不过经过jquery的加工罢了。
如过有什么不对,大家互相讨论,我也是初学者,还有很多不懂得地方。

Javascript 相关文章推荐
asp javascript 实现关闭窗口时保存数据的办法
Nov 24 Javascript
9个JavaScript评级/投票插件
Jan 18 Javascript
jQuery bind事件使用详解
May 05 Javascript
node.js中的console.warn方法使用说明
Dec 09 Javascript
JS动态改变表格边框宽度的方法
Mar 31 Javascript
Js的Array数组对象详解
Feb 22 Javascript
AngularJs基于角色的前端访问控制的实现
Nov 07 Javascript
ES6中的rest参数与扩展运算符详解
Jul 18 Javascript
详解HTML5 使用video标签实现选择摄像头功能
Oct 25 Javascript
如何利用ES6进行Promise封装总结
Feb 11 Javascript
Vue-Cli 3.0 中配置高德地图的两种方式
Jun 19 Javascript
解决jquery validate 验证不通过后验证正确的信息仍残留在label上的方法
Aug 27 jQuery
基于jquery的滚动新闻列表
Jun 19 #Javascript
基于Jquery的温度计动画效果
Jun 18 #Javascript
JQuery Dialog的内存泄露问题解决方法
Jun 18 #Javascript
通过jQuery打造支持汉字,拼音,英文快速定位查询的超级select插件
Jun 18 #Javascript
jquery ready()的几种实现方法小结
Jun 18 #Javascript
JQuery在光标位置插入内容的实现代码
Jun 18 #Javascript
JavaScript Chart 插件整理
Jun 18 #Javascript
You might like
各种战术和打法的原创者
2020/03/04 星际争霸
特详细的PHPMYADMIN简明安装教程
2008/08/01 PHP
使用cookie实现统计访问者登陆次数
2013/06/08 PHP
给WordPress的编辑后台添加提示框的代码实例分享
2015/12/25 PHP
PHP的Laravel框架中使用消息队列queue及异步队列的方法
2016/03/21 PHP
WordPress中的shortcode短代码功能使用详解
2016/05/17 PHP
PHP截取发动短信内容的方法
2017/07/04 PHP
让页面上两个div中的滚动条(滑块)同步运动示例
2013/08/07 Javascript
js编写trim()函数及正则表达式的运用
2013/10/24 Javascript
JavaScript实现的商品抢购倒计时功能示例
2017/04/17 Javascript
Makefile/cmake/node-gyp中区分判断不同平台的方法
2018/12/18 Javascript
layui layer select 选择被遮挡的解决方法
2019/09/21 Javascript
详解mpvue开发微信小程序基础知识
2019/09/23 Javascript
JS实现横向跑马灯效果代码
2020/04/20 Javascript
[03:44]2015国际邀请赛选手档案—Cloud9.NoTail
2015/07/28 DOTA
python正则匹配查询港澳通行证办理进度示例分享
2013/12/27 Python
Django1.3添加app提示模块不存在的解决方法
2014/08/26 Python
python对list中的每个元素进行某种操作的方法
2018/06/29 Python
python3使用matplotlib绘制散点图
2019/03/19 Python
pyqt5对用qt designer设计的窗体实现弹出子窗口的示例
2019/06/19 Python
如何使用python代码操作git代码
2020/02/29 Python
简单了解Java Netty Reactor三种线程模型
2020/04/26 Python
python3 sleep 延时秒 毫秒实例
2020/05/04 Python
利用canvas实现图片压缩的示例代码
2018/07/17 HTML / CSS
Jacadi Paris英国官网:法国童装品牌
2019/08/09 全球购物
军训生自我鉴定范文
2013/12/27 职场文书
报到证丢失证明
2014/01/11 职场文书
临床医师个人自我评价
2014/04/06 职场文书
中层干部竞聘演讲稿
2014/05/15 职场文书
公司任命书范本
2014/06/04 职场文书
药品营销策划方案
2014/06/15 职场文书
艺术学院毕业生求职信
2014/07/09 职场文书
2015年国庆节演讲稿范文
2015/07/30 职场文书
pytorch 一行代码查看网络参数总量的实现
2021/05/12 Python
Python中的np.argmin()和np.argmax()函数用法
2021/06/02 Python
Docker下安装Oracle19c
2022/04/13 Servers