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 相关文章推荐
绑定回车enter事件代码
May 18 Javascript
使用jquery实现放大镜效果
Sep 02 Javascript
js图片卷帘门导航菜单特效代码分享
Sep 10 Javascript
jQuery中的ajax async同步和异步详解
Sep 29 Javascript
JavaScript中的闭包
Feb 24 Javascript
在JavaScript中对HTML进行反转义详解
May 18 Javascript
AngularJS控制器详解及示例代码
Aug 16 Javascript
JS实现屏蔽网页右键复制及ctrl+c复制的方法【2种方法】
Sep 04 Javascript
js读取本地文件的实例
Dec 22 Javascript
vue-cli webpack 引入jquery的方法
Jan 10 jQuery
微信小程序列表中item左滑删除功能
Nov 07 Javascript
JS变量提升及函数提升实例解析
Sep 03 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
phpmail类发送邮件函数代码
2012/02/20 PHP
php自定义函数实现JS的escape的方法示例
2016/07/07 PHP
php批量转换文件夹下所有文件编码的函数类
2017/08/06 PHP
javascript写的日历类(基于pj)
2010/12/28 Javascript
js Event对象的5种坐标
2011/09/12 Javascript
javascript中的nextSibling使用陷(da)阱(keng)
2014/05/05 Javascript
javascript定义变量时有var和没有var的区别探讨
2014/07/21 Javascript
jquery验证邮箱格式并显示提交按钮
2015/11/07 Javascript
JavaScript实现点击按钮直接打印
2016/01/06 Javascript
微信小程序中顶部导航栏的实现代码
2017/03/30 Javascript
ES6新特性之字符串的扩展实例分析
2017/04/01 Javascript
通过学习bootstrop导航条学会修改bootstrop颜色基调
2017/06/11 Javascript
从setTimeout看js函数执行过程
2017/12/19 Javascript
Vue单页应用引用单独的样式文件的两种方式
2018/03/30 Javascript
在Vue项目中使用d3.js的实例代码
2018/05/01 Javascript
Js 利用正则表达式和replace函数获取string中所有被匹配到的文本(推荐)
2018/10/28 Javascript
基于Vue插入视频的2种方法小结
2019/04/02 Javascript
vue router 通过路由来实现切换头部标题功能
2019/04/24 Javascript
vue搜索和vue模糊搜索代码实例
2019/05/07 Javascript
Jquery让form表单异步提交代码实现
2019/11/14 jQuery
基于JavaScript实现留言板功能
2020/03/16 Javascript
Vue项目页面跳转时浏览器窗口上方显示进度条功能
2020/03/26 Javascript
python实现简单socket通信的方法
2016/04/19 Python
python学生管理系统学习笔记
2019/03/19 Python
Python爬虫进阶之爬取某视频并下载的实现
2020/12/08 Python
css3打造一款漂亮的卡哇伊按钮
2013/03/20 HTML / CSS
英国领先的电动可调床制造商:Laybrook
2019/12/26 全球购物
毕业设计计划书
2014/01/09 职场文书
校园公益广告语
2014/03/13 职场文书
文明寄语大全
2014/04/11 职场文书
工资收入证明样本(5篇)
2014/09/16 职场文书
2015年医院保卫科工作总结
2015/07/23 职场文书
高中运动会广播稿
2015/08/19 职场文书
推荐六本经典文学奖书籍:此生必读
2019/08/22 职场文书
通过T-SQL语句创建游标与实现数据库加解密功能
2022/03/16 SQL Server
python三子棋游戏
2022/05/04 Python