本文是通过实例来帮助大家深刻理解js闭包,是篇非常不错的文章,这里推荐给大家,有需要的小伙伴可以参考下
Js闭包
闭包前要了解的知识
1. 函数作用域
(1).Js语言特殊之处在于函数内部可以直接读取全局变量
复制代码 代码如下: <script type="text/javascript">
var n=100;
function parent(){
alert(n);
}
parent();//100
</script>
如果在php里
复制代码 代码如下: <?php
$n=100;
function parent(){
echo $n;
}
parent();//会报错 n未定义
?>
(2).在函数外部无法读取函数内的局部变量
复制代码 代码如下: <script type="text/javascript">
function parent(){
var m=50;
}
parent();
alert(m);//报错 m未定义
</script>
注意函数内部声明变量时一定要加var,否则就声明了一个全局变量
复制代码 代码如下: function parent(){
m=50;
}
parent();
alert(m);//50
//当然在php里更是如此了,
复制代码 代码如下: <?php
function parent(){
global $m;//全局 ,定义与赋值要分开
$m=50;
}
parent();
echo $m;//50
?>
//没global的话,一样会报没定义的错误
有时,需要得到函数内部的的局部变量,就需要变通的方法实现利用js变量作用域的特点,如在函数内部定义子函数,对于子函数来说,父函数就是它的全局,子函数可以访问父函数里的变量(对于整个js代码来说又是局部变量)
复制代码 代码如下: <script type="text/javascript">
function parent(){
var m=50;
function son(){
alert(m);
}
return son;
}
var s=parent();//将结果保存在全局里
s();//50
</script>
Parent内部所有局部变量对其子函数来说都是可见的,但其子函数内的局部变量对其父函数是不可见的,这就是js特有的链式作用域结构,子对象会一级一级地向上查找所有父对象的变量,父对象的所有变量对子对象都是可见的,反之不成立!上面的son函数就是闭包
有些同学可能这样
复制代码 代码如下: function parent(){
var m=50;
function son(){
alert(m);
}
}
parent();
son()//会报 函数son未定义
注意 在javascript里,在函数里声明的函数都是局部的,函数运行完后就释放了
注意这点与php的区别
复制代码 代码如下: <?php
function parent(){
function son(){
$m=50;
echo $m;
}
}
parent();
son();//输出50 不会报错
?>
闭包
函数内部定义函数,连接函数内部和外部的桥梁
闭包的作用有2个:
一是前面提到的读取函数内部的变量,
二是让这些变量的值保存在内存中,实现数据共享
下面是几个闭包的例子
复制代码 代码如下: <script type="text/javascript">
var cnt=(function(){
var i=0;
return function(){
alert(i);
i++;
}
})();
cnt();//0
cnt();//1
cnt();//2
cnt();//3
</script>
把匿名函数的执行结果(即对里面子函数的声明赋给全局变量cut),i就保存在内存里了
执行cut()时就直接从内存取值了,i只有cnt()函数才能调用,直接alert(i)是不行的
还可以向闭包内传参
复制代码 代码如下: var cnt=(function(num){
return function(){
alert(num);
num++;
}
})(5);
cnt();//5
cnt();//6
cnt();//7
//当然还可以调用时传参
var cnt=(function(){
var i=0;
return function(num){
num+=i;
alert(num);
i++;
}
})();
cnt(1);//1
cnt(2);//3
cnt(3);//5
为了对闭包有更好的理解,我们看以下代码
比如我想返回一个数组,数组里面有5个函数,第一个函数弹出0,第二个弹出1...
代码如果这样写
复制代码 代码如下: function box(){
var arr=[];
for(i=0;i<;i++){
arr=function(){return i;}
}
return arr;
}
var a=box();
alert(a);//包含五个函数体的数组
alert(a[0]());
alert(a[1]());
弹出的函数体
function(){return i;} }
最后这个i是4,之后++成为5
For循环停止
发现均弹出5,明显不符合我们的要求
解决方案1
自我即时执行里面的函数
复制代码 代码如下: function box(){
var arr=[];
for(i=0;i<5;i++){
arr=(function(num){return i;})(i);
}
return arr;
}
var a=box();
for(var i=0;i<a.length;i++){
alert(a);
}
但是我们发现 返回的数组里的元素是函数执行的结果,但我们想要的是函数有得升级我们的代码
解决方案2
闭包实现
复制代码 代码如下: function box(){
var arr=[];
for(var i=0;i<5;i++){
arr=(function(num){
return function(){return num;}
})(i);
}
return arr;
}
var arr=box();
for(var i=0;i<5;i++){
alert(arr());//0,1,2,3,4
}
关键代码
复制代码 代码如下: arr=(function(num){
return function(){return num;}
})(i); i=0 时
arr[0]=(function(num){return function(){return num;}})(0);
1时 arr[1]=(function(num){return function(){return num;}})(1);
以上就是闭包的好处!非常简单实用吧。

js闭包实例汇总的更多相关文章

  1. js 闭包实例

    var db = (function() { // 创建一个隐藏的object, 这个object持有一些数据 // 从外部是不能访问这个object的 var data = {}; // 创建一个函 ...

  2. js闭包实例展示

    准确来说,闭包是基于正常的垃圾回收处理机制下的.也就是说,一般情况一个函数(函数作用域)执行完毕,里面声明的变量会全部释放,被垃圾回收器回收.但闭包利用一个技巧,让作用域里面的变量,在函数执行完之后依 ...

  3. js闭包理解实例小结

    Js闭包 闭包前要了解的知识  1. 函数作用域 (1).Js语言特殊之处在于函数内部可以直接读取全局变量 <script type="text/javascript"> ...

  4. Js闭包的用途

    本来想总结一点JavaScript中的闭包的一些用法,在查资料的时候发现了一篇很好的文章,就转过来收藏了,下面附上传送门: js闭包的用途 ---------sunlylorn 我们来看看闭包的用途. ...

  5. js闭包vs Java内部类

    前言: 昨天写了一个关于Java内部的博客,在内部类的最后一点中谈到了Java闭包的概念,他是这样定义闭包的:闭包是一个可调用的对象,它记录了一些信息,这些信息来自创建它的作用域.结合Java的内部类 ...

  6. js闭包的作用

    js闭包的用途详解 js闭包可以用在许多地方.它的最大用处有两个,一个是前面提到的可以读取函数内部的变量,另一个就是让这些变量的值始终保持在内存中.具体怎么理解呢,各位看官请仔细看好下文   我们来看 ...

  7. JS闭包、作用域链、垃圾回收、内存泄露相关知识小结

    补充: 闭包(closure)是Javascript语言的一个难点,也是它的特色,很多高级应用都要依靠闭包实现. 闭包的三个特性: 1.函数嵌套函数 2.函数内部可以引用外部的参数和变量 3.参数和变 ...

  8. js闭包的用途详解

    js闭包可以用在许多地方.它的最大用处有两个,一个是前面提到的可以读取函数内部的变量,另一个就是让这些变量的值始终保持在内存中 我们来看看闭包的用途.事实上,通过使用闭包,我们可以做很多事情.比如模拟 ...

  9. js闭包作用(避免使用全局变量)

    js闭包作用(避免使用全局变量) 一.总结 1.优点::可以把局部变量驻留在内存中,可以避免使用全局变量; 2.缺点:也有占用更多内存的缺点,用完要及时让垃圾回收器回收  fn=null //应及时解 ...

随机推荐

  1. django的cookie和session以及内置信号、缓存

    cookie和session cookie和session的作用: cookie和session都记录了客户端的某种状态,用来跟踪用户访问网站的整个回话.两者最大的区别是cookie的信息是存放在浏览 ...

  2. 使用setTimeout模拟setInterval效果

    由于现在部分浏览器基于对系统性能的优化,在使用setInterval的时候,在页面没有获得关注的状态,浏览器可以会自动将setInterval终端,等到该页面重新获得关注时再开启.这样就会使得一些基于 ...

  3. 【HDU 1007】Quoit Design

    http://acm.hdu.edu.cn/showproblem.php?pid=1007 最近欧式距离模板题. 用分治大法(分治的函数名用cdq纯属个人习惯_(:з」∠)_) 一开始狂M. 后来判 ...

  4. AOJ 740 求和

      链接:http://icpc.ahu.edu.cn/OJ/Problem.aspx?id=740   Description 对于正整数n,k,我们定义这样一个函数f,它满足如下规律f(n,k=1 ...

  5. vs 2005中解决找不到模板项

    开始-->所有程序-->Microsoft Visual Studio 2005-->Visual Studio Tools-->Visual Studio 2005 Comm ...

  6. poj 2503 Babelfish(字典树哈希)

    Time Limit: 3000MS Memory Limit: 65536K Total Submissions: 29059 Accepted: 12565 Description You hav ...

  7. 浅谈MAIC 2016第二届移动应用(APP)创新大会

    MAIC 2016第二届移动应用(APP)创新大会将于2016年12月在上海举办!MAIC一届比一届办的有质量,规模越大.今年也如约而至,预计今年MAIC规模逾2000人.大会以专业会议,创新应用展览 ...

  8. bzoj 5301: [Cqoi2018]异或序列 (莫队算法)

    链接:https://www.lydsy.com/JudgeOnline/problem.php?id=5301 题面; 5301: [Cqoi2018]异或序列 Time Limit: 10 Sec ...

  9. 简单搭个webapp开发框架

    集成开发工具idea 服务器容器Tomcat 第三方依赖管理maven 暂时不集成 (spring+springmvc+mybatis(数据持久层存取)+dubbo+zookeeper(集群调度)) ...

  10. win32-api: 让 static 控件中的水平横行,垂直居中。

    CreateWindowEx(....., SS_CENTER | SS_CENTERIMAGE); SS_CENTER  能让文字水平居中. SS_CENTERIMAGE 能让文字垂直居中. htt ...