今天踩了一个基础坑

简介: 不知道大家有没有这样一种经历:突然发现自己之前很长时间都根深蒂固的一个观点是错误的?

引言


不知道大家有没有这样一种经历:突然发现自己之前很长时间都根深蒂固的一个观点是错误的?


我今天就踩了一个坑:我的印象中一直以来记得 setInterval 在定义好之后会立即执行一次里面的逻辑,所以在实现下图的逻辑时,我将第二步(”立即执行逻辑 a“)给省去了,这一省却给我带来了了一个bug,汗~


出了 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);


虽然逻辑和上面是一样的,但不知为啥感觉这么写就是有点高大上呢,-


结束语


其实我自己到现在还没理解自己为什么会有那么一个错误的记忆,并且这么长时间以来都没有发现修正。


犯错误不可怕,可怕的是没意识自己犯了错!


打铁还需自身硬,别看别人的实现方式有多高大上,其实都是基础知识的一些合理组合使用的结果而已,只要你基础够好,那即使面对一段简简单单的代码也能玩出不一样的花样!


~ 本文完,感谢阅读!


学习有趣的知识,结识有趣的朋友,塑造有趣的灵魂!




相关文章
|
Web App开发 JavaScript 前端开发
使用 Chrome 浏览器的内存分析工具来检测 JavaScript 中的内存泄漏
【10月更文挑战第25天】利用 Chrome 浏览器的内存分析工具,可以较为准确地检测 JavaScript 中的内存泄漏问题,并帮助我们找出潜在的泄漏点,以便采取相应的解决措施。
1487 9
|
Python
Python列表推导式是一种简洁的创建新列表的方式,它允许你在一行代码中完成对数据的操作和转换
【6月更文挑战第19天】Python列表推导式是创建新列表的简洁语法,它在一行内处理数据。表达式如`[expr for item in iterable if cond]`,其中`expr`是对元素的操作,`item`来自`iterable`,`if cond`是可选过滤条件。例如,将数字列表平方:`[x**2 for x in numbers]`。嵌套列表推导处理复杂结构,如合并二维数组:`[[a+b for a,b in zip(row1, row2)] for row1, row2 in zip(matrix1, matrix2)]`。简洁但勿过度复杂化。
128 5
CES,阿里云在这里!
CES,阿里云在这里!
208 1
|
传感器 移动开发 前端开发
从《淘特斗地主》说起,前端如何做 h5 游戏的游戏体验
从《淘特斗地主》说起,前端如何做 h5 游戏的游戏体验
1309 1
从《淘特斗地主》说起,前端如何做 h5 游戏的游戏体验
|
弹性计算 网络协议 Linux
阿里云服务器安装PPTP VPN全流程
阿里云服务器安装PPTP VPN全流程,现在安全组中开放PPTP的1723端口,然后在服务器上安装PPTP服务端,最后配置客户端即可
18600 1
阿里云服务器安装PPTP VPN全流程
力扣:对于有关深度优先探索的二叉树题
力扣:对于有关深度优先探索的二叉树题
243 0
|
存储 调度
【攻破技术盲点】一起学习和巩固TCC分布式事务模型
【攻破技术盲点】一起学习和巩固TCC分布式事务模型
366 0
【攻破技术盲点】一起学习和巩固TCC分布式事务模型
|
应用服务中间件 nginx 数据安全/隐私保护
Nginx模块学习(二)
Nginx模块学习(二)
292 0
Nginx模块学习(二)
|
SQL Cloud Native Dubbo
注册配置、微服务治理、云原生网关三箭齐发,阿里云 MSE 持续升级
微服务引擎MSE面向业界主流开源微服务项目, 提供注册配置中心和分布式协调(原生支持Nacos/ZooKeeper/Eureka)、云原生网关(原生支持Ingress/Envoy)、微服务治理(原生支持Spring Cloud/Dubbo/Sentinel,遵循 OpenSergo 服务治理规范)能力。
注册配置、微服务治理、云原生网关三箭齐发,阿里云 MSE 持续升级