js只执行1次的函数示例


Posted in Javascript onJuly 20, 2016

在我们日常开发的时候,经常会碰到一种这样的情况:想让某个函数只执行一次,特别是在一些循环或定时执行的时候。

废话不多说,直接上代码:

function runOnce(fn, context) { //控制让函数只触发一次
  return function () {
    try {
      fn.apply(context || this, arguments);
    }
    catch (e) {
      console.error(e);//一般可以注释掉这行
    }
    finally {
      fn = null;
    }
  }
}
 
// Usage 1:
var a = 0;
var canOnlyFireOnce = runOnce(function () {
  a++;
  console.log(a);
});
 
canOnlyFireOnce(); //1
canOnlyFireOnce(); // nothing
canOnlyFireOnce(); // nothing
 
// Usage 2:
var name = "张三";
var canOnlyFireOnce = runOnce(function () {
  console.log("你好" + this.name);
});
canOnlyFireOnce(); //你好张三
canOnlyFireOnce(); // nothing
 
// Usage 3:
var obj = {name: "天涯孤雁", age: 24};
var canOnlyFireOnce = runOnce(function () {
  console.log("你好" + this.name);
}, obj);
canOnlyFireOnce(); //你好天涯孤雁
canOnlyFireOnce(); // nothing

因为返回函数执行一次后,fn = null将其设置未null,所以后面就不会执行了。再贴一个网上别人分享的代码,道理一样的:

function once(fn, context) { 
  var result;
 
  return function() { 
    if(fn) {
      result = fn.apply(context || this, arguments);
      fn = null;
    }
 
    return result;
  };
}
 
// Usage
var canOnlyFireOnce = once(function() {
  console.log('Fired!');
});
 
canOnlyFireOnce(); // "Fired!"
canOnlyFireOnce(); // nothing

以上就是为大家整理让javascript只执行一次的函数示例,有需要的可以参考。

Javascript 相关文章推荐
Iframe 自动适应页面的高度示例代码
Feb 26 Javascript
简单讲解AngularJS的Routing路由的定义与使用
Mar 05 Javascript
hovertree插件实现二级树形菜单(简单实用)
Dec 28 Javascript
微信小程序 JS动态修改样式的实现代码
Feb 10 Javascript
js 动态生成html 触发事件传参字符转义的实例
Feb 14 Javascript
Vuex之理解Store的用法
Apr 19 Javascript
JS判断时间段的实现代码
Jun 14 Javascript
vue和webpack打包项目相对路径修改的方法
Jun 15 Javascript
解决Vue.js父组件$on无法监听子组件$emit触发事件的问题
Sep 12 Javascript
js module大战
Apr 19 Javascript
JS数组的常用10种方法详解
May 08 Javascript
uniapp引入支付宝原生扫码插件步骤详解
Jul 23 Javascript
JQuery为元素添加样式的实现方法
Jul 20 #Javascript
JCrop+ajaxUpload 图像切割上传的实例代码
Jul 20 #Javascript
javaScript给元素添加多个class的简单实现
Jul 20 #Javascript
JavaScript中数组的22种方法必学(推荐)
Jul 20 #Javascript
JavaScript DOM 对象深入了解
Jul 20 #Javascript
JavaScript中的splice方法用法详解
Jul 20 #Javascript
Bootstrap被封装的弹层
Jul 20 #Javascript
You might like
php中使用__autoload()自动加载未定义类的实现代码
2013/02/06 PHP
php导出excel格式数据问题
2014/03/11 PHP
php中的curl_multi系列函数使用例子
2014/07/29 PHP
php while循环控制的简单实例
2016/05/30 PHP
js原型链原理看图说明
2012/07/07 Javascript
把input初始值不写value的具体实现方法
2013/07/04 Javascript
jquery ajax传递中文参数乱码问题及解决方法说明
2014/02/07 Javascript
基于JavaScript实现Json数据根据某个字段进行排序
2015/11/24 Javascript
JS提示:Uncaught SyntaxError: Unexpected token ILLEGAL错误的解决方法
2016/08/19 Javascript
JSON对象 详解及实例代码
2016/10/18 Javascript
浅谈Angular的$q, defer, promise
2016/12/20 Javascript
AngularJS入门示例之Hello World详解
2017/01/04 Javascript
Javascript调试之console对象——你不知道的一些小技巧
2017/07/10 Javascript
bootstrap table表格客户端分页实例
2017/08/07 Javascript
深入理解Vue.js源码之事件机制
2017/09/27 Javascript
用Node写一条配置环境的指令
2019/11/14 Javascript
使用python实现扫描端口示例
2014/03/29 Python
Python中利用函数装饰器实现备忘功能
2015/03/30 Python
名片管理系统python版
2018/01/11 Python
Python之ReportLab绘制条形码和二维码的实例
2018/01/15 Python
python中不能连接超时的问题及解决方法
2018/06/10 Python
keras topN显示,自编写代码案例
2020/07/03 Python
Django REST 异常处理详解
2020/07/15 Python
PyQt5 QDockWidget控件应用详解
2020/08/12 Python
node中使用shell脚本的方法步骤
2021/03/23 Javascript
采购部主管岗位职责
2014/01/01 职场文书
咖啡店自主创业商业计划书
2014/01/22 职场文书
副校长个人对照检查材料思想汇报
2014/10/04 职场文书
实习协议书
2015/01/27 职场文书
2015年校医个人工作总结
2015/07/24 职场文书
医院病假条范文
2015/08/17 职场文书
python使用tkinter实现透明窗体上绘制随机出现的小球(实例代码)
2021/05/17 Python
Python中OpenCV实现查找轮廓的实例
2021/06/08 Python
python中subplot大小的设置步骤
2021/06/28 Python
详解Redis在SpringBoot工程中的综合应用
2021/10/16 Redis
SpringCloud Feign请求头删除修改的操作代码
2022/03/20 Java/Android