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 相关文章推荐
JQuery实现自定义对话框的代码
Jun 15 Javascript
jQuery图片预加载 等比缩放实现代码
Oct 04 Javascript
jquery.ui.draggable中文文档(原文翻译)
Nov 15 Javascript
DOM基础教程之模型中的模型节点
Jan 19 Javascript
zepto.js中tap事件阻止冒泡的实现方法
Feb 12 Javascript
JavaScript中使用自然对数ln的方法
Jun 14 Javascript
jQuery实现动态文字搜索功能
Jan 05 Javascript
深入理解vue-loader如何使用
Jun 06 Javascript
微信小程序日历组件calendar详解及实例
Jun 08 Javascript
Node.js中的child_process模块详解
Jun 08 Javascript
详解三种方式解决vue中v-html元素中标签样式
Nov 22 Javascript
JS+CSS+HTML实现“代码雨”类似黑客帝国文字下落效果
Mar 17 Javascript
基于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
PHP中使用curl入门教程
2015/07/02 PHP
php+html5基于websocket实现聊天室的方法
2015/07/17 PHP
PHP实现的登录页面信息提示功能示例
2017/07/24 PHP
php7 错误处理机制修改实例分析
2020/05/25 PHP
广告显示判断
2006/08/31 Javascript
避免回车键导致的页面无意义刷新的解决方法
2011/04/12 Javascript
jquery加载页面的方法(页面加载完成就执行)
2011/06/21 Javascript
说说JSON和JSONP 也许你会豁然开朗
2012/09/02 Javascript
ExtJS4如何自动生成控制grid的列显示、隐藏的checkbox
2014/05/02 Javascript
js获取url中&quot;?&quot;后面的字串方法
2014/05/15 Javascript
javascript中HTMLDOM操作详解
2014/12/11 Javascript
浅谈javascript中for in 和 for each in的区别
2015/04/23 Javascript
js实现超简单的展开、折叠目录代码
2015/08/28 Javascript
jsonp实现百度下拉框功能的方法分析
2019/05/10 Javascript
Vue+abp微信扫码登录的实现代码示例
2020/01/06 Javascript
原生javascript制作的拼图游戏实现方法详解
2020/02/23 Javascript
[48:28]完美世界DOTA2联赛循环赛FTD vs Magma第二场 10月30日
2020/10/31 DOTA
深入理解NumPy简明教程---数组2
2016/12/17 Python
详解PyTorch批训练及优化器比较
2018/04/28 Python
python找出完数的方法
2018/11/12 Python
解决Atom安装Hydrogen无法运行python3的问题
2019/08/28 Python
keras获得model中某一层的某一个Tensor的输出维度教程
2020/01/24 Python
医学毕业生自我鉴定
2013/10/30 职场文书
工程招投标邀请书
2014/01/30 职场文书
阅兵口号
2014/06/19 职场文书
房地产资料员岗位职责
2014/07/02 职场文书
解放思想演讲稿
2014/09/11 职场文书
群众路线自查自纠工作情况报告
2014/10/28 职场文书
环卫工作汇报材料
2014/10/28 职场文书
2014年幼儿园老师工作总结
2014/12/05 职场文书
商务邀请函
2015/01/30 职场文书
python实现简单反弹球游戏
2021/04/12 Python
MySQL中distinct和count(*)的使用方法比较
2021/05/26 MySQL
MySQL子查询中order by不生效问题的解决方法
2021/08/02 MySQL
CSS精灵图的原理与使用方法介绍
2022/03/17 HTML / CSS
Python安装及建立虚拟环境的完整步骤
2022/06/25 Servers