【转】JavaScript闭包

时间:2023-02-26 15:05:34
 
使用外部变量的函数就是闭包,闭包可以给我们带来一些便利,就是可以在高等级的作用域使用低等级作用域中的变量:
 
例:
var data = [];
function demo(){
var data = [];
return{
add:function(a){
data.push(a);
},
print:function(){
console.log("printing...");
console.log(data);
console.log("------");
}
}
}
var tool = demo();
tool.add(1);
tool.add(2);
tool.add(3);
tool.print();//[1, 2, 3]
 
console.log(data);
 
运行结果:
printing...
[1, 2, 3]
------
[]
 
 
我们可以利用demo函数里面的data来存储我们的信息而且不用担心它被破坏(demo里面的data被私有化),而且我们也可以在外部在声明一个同名的data来存储别的信息,这两个不会产生任何冲突。
 
闭包也可以帮我们解决一些小问题:
for(var i=0;i<4;i++){
setTimeout(function(){
console.log(i);
});
}
  我们预期的结果是打印当前循环的i值结果输出全是4。先解释一下出现这么情况的原因:JS是一种单线程的语言,而setTimeout是异步的,只有当我们的代码执行完成以后setTimeout的处理函数才会执行,而执行的时候i的值已经是4了所以最终的输出全是4。
  我们可以通过闭包来解决这一问题:
for(var i=0;i<4;i++){
(function(i){
setTimeout(function(){
console.log(i);
});
}(i))
}
  闭包可以形成一个独立的作用域这样每次循环都会有一个独立的函数作用域,循环完成后虽然i的值仍然是4但是setTimeout的处理函数在寻找i的时候会优先找到作为参数的i,而每一个参数i都表示当次循环的i,利用闭包我们可以完美的解决这种问题。
  在我们实际开发的过程中,遇到这种情况我们就可以通过闭包来解决,我们所说的"这种情况"通常有三个特点:
  1.首先有一个循环
  2.循环里面会创建函数,并且函数是延后执行的
  3.这些延后执行的函数会使用一个共同的变量,并且这个共同的变量和当前的循环值有关系
  我们按照这个规律套一下上面的代码:
  循环有了,每次循环也会生成一个函数,这些函数也都是在循环完成后才能执行,而且每一个函数都使用共同的i,而i就是当前的循环值,正好符合我们的三个特点。我们通过(function(){}())这种方式(匿名函数自执行)来形成一个闭包达到我们预期的目的。

【转】JavaScript闭包的更多相关文章

  1. 《Web 前端面试指南》1、JavaScript 闭包深入浅出

    闭包是什么? 闭包是内部函数可以访问外部函数的变量.它可以访问三个作用域:首先可以访问自己的作用域(也就是定义在大括号内的变量),它也能访问外部函数的变量,和它能访问全局变量. 内部函数不仅可以访问外 ...

  2. JavaScript 闭包深入浅出

    闭包是什么? 闭包是内部函数可以访问外部函数的变量.它可以访问三个作用域:首先可以访问自己的作用域(也就是定义在大括号内的变量),它也能访问外部函数的变量,和它能访问全局变量. 内部函数不仅可以访问外 ...

  3. JavaScript闭包&lpar;Closure&rpar;

    JavaScript闭包(Closure) 本文收集了多本书里对JavaScript闭包(Closure)的解释,或许会对理解闭包有一定帮助. <你不知道的JavsScript> Java ...

  4. Javascript闭包和C&num;匿名函数对比分析

    C#中引入匿名函数,多少都是受到Javascript的闭包语法和面向函数编程语言的影响.人们发现,在表达式中直接编写函数代码是一种普遍存在的需求,这种语法将比那种必须在某个特定地方定义函数的方式灵活和 ...

  5. javascript闭包理解

    //闭包理解一 function superFun(){ var _super_a='a'; function subfuc(){ console.log(_super_a); } return su ...

  6. Javascript闭包深入解析及实现方法

    1.什么是闭包 闭包,官方对闭包的解释是:一个拥有许多变量和绑定了这些变量的环境的表达式(通常是一个函数),因而这些变量也是该表达式的一部分.闭包的特点:1. 作为一个函数变量的一个引用,当函数返回时 ...

  7. javascript闭包和作用域链

    最近在学习前端知识,看到javascript闭包这里总是云里雾里.于是翻阅了好多资料记录下来本人对闭包的理解. 首先,什么是闭包?看了各位大牛的定义和描述各式各样,我个人认为最容易一种说法: 外部函数 ...

  8. JavaScript闭包深入解析

    for (var i=1; i<=5; i++) { setTimeout( function timer() { console.log( i ); }, i*1000 ); } --上面这段 ...

  9. JavaScript 闭包系列二(匿名函数及函数的闭包)

    一. 匿名函数 1. 函数的定义,可分为三种 1) 函数声明方式 function double(x) {     return 2*x; } 2)Function构造函数,把参数列表和函数体都作为字 ...

  10. JavaScript闭包模型

      JavaScript闭包模型 -----  [原创翻译]2016-09-01  09:32:22 < 一>  闭包并不神秘 本文利用JavaScript代码来阐述闭包,目的是为了使普通 ...

随机推荐

  1. mui适用场景说明,能不能在普通浏览器里使用,能否用于wap网站

    mui适用场景说明 为解决HTML5在低端Android机上的性能缺陷,mui引入了原生加速,其中最关键的就是webview控件,因此mui若要发挥其全部能力,需和5+ App配合适用,若脱离5+ A ...

  2. Be Careful With BuildConfig&period;DEBUG

    Be Careful With BuildConfig.DEBUG http://www.digipom.com/be-careful-with-buildconfig-debug/

  3. svg学习笔记(一)

    SVG——可扩展适量图形,基于XML PC端:IE9+   wap端:表现良好,适合使用 基础图形: line(线段)  <line x1="25" y1="150 ...

  4. 【转】MFC界面更新实现方法

    原文网址:http://www.cnblogs.com/skywatcher/p/3572311.html 1.更新窗口 即采用UpdateWindow()函数立即发送WM_PAINT消息更新整个窗口 ...

  5. C&num;学习第六天

    今天的内容主要是参数数组,C#允许函数指定一个(只能指定一个)特定的参数,这个参数必须是函数定义中最后一个参数,成为参数数组. 参数数组可以使用个数不定的参数调用函数,可以使用params关键字定义它 ...

  6. windows程序设计简介

    大家好,非常高兴和大家一起分享Windows开发心得,Windows已经诞生很多年了,一直因为它的简单易用而深受欢迎,相信很多人在使用Windows的时候,一定有这样一个想法:希望自己将来可以写一个很 ...

  7. 使CSS3样式在IE里面有效果

    1. 下载ie-css3.htc文件 2. 当前元素一定要有定位属性,像是position:relative或是position:absolute属性. 3. z-index值一定要比周围元素的要高 ...

  8. ecshop邮件订阅按&OpenCurlyDoubleQuote;订阅”没反应

    原订阅邮件所使用的JS文件transport.js和JQuery冲突,会更改transport.js文件,用以下代码可同样实现订阅功能. <input type="text" ...

  9. 分页-jquery&period;page&period;js插件在使用时重复触发&OpenCurlyDoubleQuote;上一页”和&OpenCurlyDoubleQuote;下一页”操作

    HTML代码 <!-- <div class="zxf_pagediv" id="Pagination" style="display:b ...

  10. Linux服务器配置---安装centos

    安装centos 1.插入光盘,启动,可以选择第一项进行安装 2.根据实际需求,一般会选择skip 3.选择语言“简体中文” 4.选择第一项 5.设置主机名字,使用默认 6.选择时区 7.设置超级用户 ...