js只执行1次的函数示例

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

废话不多说，直接上代码：

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中运算符的优先级
js 与或运算符 || && 妙用
javascript typeof的用法与typeof运算符介绍[详细]
JS中三目运算符和if else的区别分析与示例
js的逻辑运算符 ||
Javascript 按位取反运算符 (~)
javascript三元运算符用法实例
js利用与或运算符优先级实现if else条件判断表达式
JavaScript中常用的运算符小结
js定时器(执行一次、重复执行)
js 程序执行与顺序实现详解
如何让页面加载完成后执行js
页面加载完后自动执行一个方法的js代码
js函数setTimeout延迟执行的简单介绍
页面加载完成后再执行JS的jquery写法以及区别说明
window.addEventListener来解决让一个js事件执行多个函数
js 把字符串当函数执行的方法
Js中setTimeout()和setInterval() 何时被调用执行的用法
JS实现判断滚动条滚到页面底部并执行事件的方法