setInterval立即触发一次以及setInterval同步执行的解决办法

100 阅读 0 评论 66 点赞

我是靠谱客的博主爱听歌小鸭子，最近开发中收集的这篇文章主要介绍setInterval立即触发一次以及setInterval同步执行的解决办法，觉得挺不错的，现在分享给大家，希望可以做个参考。

概述

实现setInterval刷新页面立即执行一次

问题：setInterval函数在刷新页面的时候第一次执行需要等到设置的循环时间到才执行
方法1：在setInterval函数前写一遍要执行的js代码（可实现，但不雅观），代码如下：

 console.log(“立即执行”);
setInterval(function(){
  console.log(“立即执行”);
},10000)

方法2：代码如下：

function fn() {
    console.log(“立即执行”);
    return fn    // 函数中返回自身
}
setInterval(fn(), 10000)    // 定时器中，函数先执行一次

setInterval小知识：
setInterval(fn(), 2000); 加括号立即执行,且执行一次.
setInterval(fn, 2000);不加括号,2秒后执行,且循环执行.

实现setInterval同步执行

问题：setInterval函数为异步执行（setTimeout同理），导致代码块没有执行完就进入到下一个执行条件了
方法：代码如下：

setInterval(function(){
const delay = ms => new Promise(resolve => setTimeout(resolve, ms));
(async function loop() {
    for (let i = 0; i < 13; i++) {
	    console.log(“停5秒前执行的代码”);
        await delay(5000);//线程停5秒后再执行后面的代码
        console.log(“停5秒后执行”);
    }
})();
},100000)