[图片上传失败...(image-8910ac-1644833937519)]
引言
不知道大家有没有这样一种经历：突然发现自己之前很长时间都根深蒂固的一个观点是错误的？
我今天就踩了一个坑：我的印象中一直以来记得 setInterval 在定义好之后会立即执行一次里面的逻辑，所以在实现下图的逻辑时，我将第二步（”立即执行逻辑 a“）给省去了，这一省却给我带来了了一个bug，汗~
[图片上传失败...(image-902462-1644833937519)]
出了 bug，就要补救，态度不能丢！
青铜级
说到最简单的修复方案，那就是我们经常会用到的方法，代码如下：
function fun(){}
fun();
setInterval(fun, 1000);
对，就是这么简单且朴实无华！
钻石级
既然是钻石级了，那就必须要玩出点花样，否则那不就白瞎这段位了。
上面青铜级的实现其实存在一个隐患：不能确保同一时间只有一个执行这个逻辑的定时器。那么我们再来封装一下：
let timer = null;
function func(){}
function mainFun(callback, time){
callback();
return setInterval(callback, time);
}
timer && clearInterval(timer);
timer = mainFun(func, 1000);
星耀级
使用目标函数返回目标函数自身。
let timer = null;
function func(){}
timer && clearInterval(timer);
timer = mainFun(func(), 1000);
嗯，代码格调又高了一截。
王者级
既然是需要立即执行，那为何不用自执行函数呢？
let timer = null;
timer && clearInterval(timer)
timer = setInterval((function func () {})(), 1000);
虽然逻辑和上面是一样的，但不知为啥感觉这么写就是有点高大上呢，-
结束语
其实我自己到现在还没理解自己为什么会有那么一个错误的记忆，并且这么长时间以来都没有发现修正。
犯错误不可怕，可怕的是没意识自己犯了错！
打铁还需自身硬，别看别人的实现方式有多高大上，其实都是基础知识的一些合理组合使用的结果而已，只要你基础够好，那即使面对一段简简单单的代码也能玩出不一样的花样！
~
~ 本文完，感谢阅读！
~
学习有趣的知识，结识有趣的朋友，塑造有趣的灵魂！
网友评论