JS中闭包的经典用法小结(2则示例)


Posted in Javascript onDecember 28, 2016

本文实例总结了JS中闭包的经典用法。分享给大家供大家参考,具体如下:

闭包这个东西,网上有很多介绍资料。个人看了很多,还是一知半解。这里不做理论介绍,直接给出2个例子。

代码1:记录函数被调用的次数

function a()
{
  var i = 0;
  function b()
  {
    return ++i;
  }
  return b;
}
var c = a();
c();//1
c();//2

这种方式类似C语言中的private static变量,能够保持局部变量的内存不释放。

代码2:正确给DOM注册事件处理函数

<body>
  <input type="button" id="b1" value="1">
  <input type="button" id="b2" value="2">
  <input type="button" id="b3" value="3">
  <input type="button" id="b4" value="4">
  <script type="text/javascript">
    var buttons = document.getElementsByTagName("input");
    for (var i = 0; i < buttons.length; i++)
    {
      // 方式1:i的值一直是3
      //buttons[i].onclick = function() {
      // console.log(i + " was clicked.");
      //}
      // 方式2:从0到3,是我们要的效果
      (function(i){
        buttons[i].onclick = function() {
          console.log(i + " was clicked.");
        }
      })(i);
    }
  </script>
</body>

更多关于JavaScript相关内容可查看本站专题:《javascript面向对象入门教程》、《JavaScript中json操作技巧总结》、《JavaScript切换特效与技巧总结》、《JavaScript查找算法技巧总结》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript数学运算用法总结》

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
Javascript调试工具(下载)
Jan 09 Javascript
js函数使用技巧之 setTimeout(function(){},0)
Feb 09 Javascript
细说javascript函数从函数的构成开始
Aug 29 Javascript
node.js实现端口转发
Apr 14 Javascript
浅谈Angular中ngModel的$render
Oct 24 Javascript
浅谈MVC+EF easyui dataGrid 动态加载分页表格
Nov 10 Javascript
使用JS和canvas实现gif动图的停止和播放代码
Sep 01 Javascript
微信小程序 input输入及动态设置按钮的实现
Oct 27 Javascript
基于casperjs和resemble.js实现一个像素对比服务详解
Jan 10 Javascript
详解如何使用babel进行es6文件的编译
May 29 Javascript
vue中watch和computed为什么能监听到数据的改变以及不同之处
Dec 27 Javascript
js里面的变量范围分享
Jul 18 Javascript
AngularJS实现网站换肤实例
Feb 19 #Javascript
详解js树形控件—zTree使用总结
Dec 28 #Javascript
js 轮播效果实例分享
Dec 28 #Javascript
JS正则RegExp.test()使用注意事项(不具有重复性)
Dec 28 #Javascript
Bootstrap 模态框实例插件案例分析
Dec 28 #Javascript
Angular使用ng-messages与PHP进行表单数据验证
Dec 28 #Javascript
Bootstrap中datetimepicker使用小结
Dec 28 #Javascript
You might like
mysql数据库差异比较的PHP代码
2012/02/05 PHP
PHP中的gzcompress、gzdeflate、gzencode函数详解
2014/07/29 PHP
php读取der格式证书乱码解决方法
2015/06/22 PHP
PHP 前加at符合@的作用解析
2015/07/31 PHP
Thinkphp5 微信公众号token验证不成功的原因及解决方法
2017/11/12 PHP
Laravel框架基于ajax实现二级联动功能示例
2019/01/17 PHP
thinkphp5实现微信扫码支付
2019/12/23 PHP
深入理解JavaScript系列(14) 作用域链介绍(Scope Chain)
2012/04/12 Javascript
js解析与序列化json数据(三)json的解析探讨
2013/02/01 Javascript
js怎么判断flash swf文件是否加载完毕
2014/08/14 Javascript
js实现鼠标悬停图片上时滚动文字说明的方法
2015/02/17 Javascript
jQuery中serializeArray()与serialize()的区别实例分析
2015/12/09 Javascript
jquery popupDialog 使用 加载jsp页面的方法
2016/10/25 Javascript
vue移动端微信授权登录插件封装的实例
2018/08/28 Javascript
微信小程序实现工作时间段选择
2019/02/15 Javascript
浅谈Vue页面级缓存解决方案feb-alive(上)
2019/04/14 Javascript
vue.js中使用echarts实现数据动态刷新功能
2019/04/16 Javascript
vue实现公告栏文字上下滚动效果的示例代码
2020/06/16 Javascript
Vue使用轮询定时发送请求代码
2020/08/10 Javascript
python实现简单点对点(p2p)聊天
2017/09/13 Python
使用Python设计一个代码统计工具
2018/04/04 Python
python 3.6.5 安装配置方法图文教程
2018/09/18 Python
python中import与from方法总结(推荐)
2019/03/21 Python
python Manager 之dict KeyError问题的解决
2019/12/21 Python
Python PyInstaller安装和使用教程详解
2020/01/08 Python
python实现五子棋游戏(pygame版)
2020/01/19 Python
python实现登录与注册系统
2020/11/30 Python
Aurora London官网:奢华、负担得起的皮革手袋
2020/08/01 全球购物
行政部工作岗位职责范本
2014/03/05 职场文书
土建工程师岗位职责
2014/06/10 职场文书
优秀毕业生的求职信
2014/07/21 职场文书
开展创先争优活动总结
2014/08/28 职场文书
2014年物流工作总结
2014/11/25 职场文书
追悼会答谢词范文
2015/09/29 职场文书
CSS 制作波浪效果的思路
2021/05/18 HTML / CSS
Python超详细分步解析随机漫步
2022/03/17 Python