JavaScript 如何使用 setTimeout 实现 setInterval

website multi content page

setIntervalSimulator

"use strict";

/**
*
* @author xgqfrms
* @license MIT
* @copyright xgqfrms
* @created 2020-07-27
* @modified
*
* @description setInterval
* @difficulty Easy Medium Hard
* @complexity O(n)
* @augments
* @example
* @link https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/setInterval
* @solutions
*
*/ const log = console.log; const setIntervalSimulator = (callback, time, count = 10) => {
function interval(callback, time) {
const begin = new Date().getTime();
const timerID = setTimeout(() => {
clearTimeout(timerID);
const end = new Date().getTime();
log(`time =`, (end - begin) / 1000);
// 排除 callback 执行时间的干扰
callback();
// 同步执行
if(count) {
log(`count =`, count);
count--;
interval(callback, time);
}
}, time);
}
// init
interval(callback, time);
// requestAnimationFrame();
} // setIntervalSimulator(() => console.log(`OK`), 1000 * 10);
// setIntervalSimulator(() => console.log(`OK`), 1000 * 3);
// setIntervalSimulator(() => console.log(`OK`), 10);
setIntervalSimulator(() => console.log(`OK 1000`), 1000);
// setIntervalSimulator(() => console.log(`OK 0`), 0); // time = 1.005
// OK 1000
// count = 10
// time = 1.002
// OK 1000
// count = 9
// time = 1.005
// OK 1000
// count = 8
// time = 1.003
// OK 1000
// count = 7
// time = 1.005
// OK 1000
// count = 6
// time = 1.002
// OK 1000
// count = 5
// time = 1.004
// OK 1000
// count = 4
// time = 1.004
// OK 1000
// count = 3
// time = 1.005
// OK 1000
// count = 2
// time = 1.005
// OK 1000
// count = 1
// time = 1.003
// OK 1000

setTimeoutSimulator


"use strict"; /**
*
* @author xgqfrms
* @license MIT
* @copyright xgqfrms
* @created 2020-07-27
* @modified
*
* @description setTimeout
* @difficulty Easy Medium Hard
* @complexity O(n)
* @augments
* @example
* @link https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/setTimeout
* @solutions
*
*/ const log = console.log; const setTimeoutSimulator = (callback, time) => {
const begin = new Date().getTime();
// const begin = performance.now();
// ReferenceError: performance is not defined
const timerID = setInterval(() => {
clearInterval(timerID);
const end = new Date().getTime();
// const end = performance.now();
log(`time =`, (end - begin) / 1000);
// 排除 callback 执行时间的干扰
callback();
}, time);
} // setTimeoutSimulator(() => console.log(`OK`), 1000 * 10);
// setTimeoutSimulator(() => console.log(`OK`), 1000 * 3);
// setTimeoutSimulator(() => console.log(`OK`), 10);
setTimeoutSimulator(() => console.log(`OK 1000`), 1000);
setTimeoutSimulator(() => console.log(`OK 0`), 0); // OK 0
// time = 0.006
// OK 1000
// time = 1.003 // OK 0
// time = 0.006
// OK 1000
// time = 1.006 // OK 0
// time = 0.007
// OK 1000
// time = 1.002

js 函数返回值, timoutID

https://www.cnblogs.com/xgqfrms/p/13388644.html

blank page

打印的是什么? event order id ?

Symbol

Symbol 实现原理, uuid


key1 = Symbol(`key`);
// Symbol(key)
key2 = Symbol(`key`);
// Symbol(key) key1 == key2;
// false
key1 === key2;
// false

refs

https://javascript.info/settimeout-setinterval

https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/setInterval

https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/setTimeout



xgqfrms 2012-2020

www.cnblogs.com 发布文章使用:只允许注册用户才可以访问!


JavaScript 如何使用 setTimeout 实现 setInterval的更多相关文章

  1. Javascript定时器(二)——setTimeout与setInterval

    一.解释说明 1.概述 setTimeout:在指定的延迟时间之后调用一个函数或者执行一个代码片段 setInterval:周期性地调用一个函数(function)或者执行一段代码. 2.语法 set ...

  2. JavaScript定时机制setTimeout与setInterval研究

    JavaScript的setTimeout与setInterval是两个很容易欺骗别人感情的方法,因为我们开始常常以为调用了就会按既定的方式执行, 我想不少人都深有同感, 例如 setTimeout( ...

  3. JavaScript中的setTimeout和setInterval

    上一篇博文<浏览器中Javascript单线程分析>中描述了浏览器中Javascript单线程的原理. 在此基础上,这篇文章将主要介绍setTimeout/setInterval是如何模拟 ...

  4. JavaScript定时器:setTimeout()和setInterval()

    1 超时调用setTimeout() 顾名思义,超时调用的意思就是在一段实际之后调用(在执行代码之前要等待多少毫秒) setTimeout()他可以接收两个参数: 1 要执行的代码或函数 2 毫秒(在 ...

  5. JavaScript中的setTimeout、setInterval和随机函数制作简易抽奖小程序

    几乎所有计算机语言有都内置随机函数.当然这种随机,人们习惯称为伪随机数发生器,产生的是一个[0,1)之间的一个小数.再通过简单算术运算生成一个符合需求的整数.JS中通用公式通常为parseInt(Ma ...

  6. Javascript异步编程之setTimeout与setInterval详解分析(一)

    Javascript异步编程之setTimeout与setInterval 在谈到异步编程时,本人最主要会从以下三个方面来总结异步编程(注意:特别解释:是总结,本人也是菜鸟,所以总结不好的,请各位大牛 ...

  7. 【转】Javascript异步编程之setTimeout与setInterval

    Javascript异步编程之setTimeout与setInterval 转自:http://www.tuicool.com/articles/Ebueua 在谈到异步编程时,本人最主要会从以下三个 ...

  8. setTimeout和setInterval的注意事项

    精准问题 setTimeout的问题在于它并不是精准的,例如使用setTimeout设定一个任务在10ms后执行,但是在9ms后,有一个任务占用了5ms的cpu时间片,再次轮到定时器执行时,时间已经过 ...

  9. setTimeout()与setInterval()——走马灯效果

    JavaScript中的setTimeout()与setInterval()都是指延时执行某一操作. 但setInterval()指每隔指定时间执行某操作,会循环不断地执行该操作:setTimeout ...

随机推荐

  1. Before you launch a goroutine, know when it will stop The Zen of Go

    The Zen of Go https://the-zen-of-go.netlify.app/ Ten engineering values for writing simple, readable ...

  2. ensure that both new and old access_token values are available within five minutes, so that third-party services are smoothly transitioned.

    WeChat public doc https://developers.weixin.qq.com/doc/offiaccount/en/Basic_Information/Get_access_t ...

  3. It is thread-safe and idempotent, but not reentrant.

    https://github.com/django/django/blob/master/django/apps/registry.py

  4. maven打包三种方式

    https://blog.csdn.net/w820896059/article/details/80423143

  5. Jenkins部署springboot项目

    记录jenkins如何部署springboot项目(jar类型的) 一.首先需要先配置好jenkins的基本配置(jdk.maven--),可在系统管理-->>全局工具配置中进行配置. 配 ...

  6. 浅谈自动化构建之gulp

    一.gulp的基本使用 gulp是目前最流行的前端自动化构建系统,核心特点高效易用.(这块不过多的废话了,直接上干货了,有兴趣的话,可以查下gulp简介) 步骤如下: yarn init -y yar ...

  7. scala/java等其他语言从CSV文件中读取数据,使用逗号','分割可能会出现的问题

    众所周知,csv文件默认以逗号","分割数据,那么在scala命令行里查询的数据: 可以看见,字段里就包含了逗号",",那接下来切割的时候,这本应该作为一个整体 ...

  8. LOJ10075 农场派对

    USACO 2007 Feb. Silver N(1≤N≤1000) 头牛要去参加一场在编号为 x(1≤x≤N) 的牛的农场举行的派对.有 M(1≤M≤100000) 条有向道路,每条路长Ti​(1≤ ...

  9. Java——I/O操作之拷贝文件

    功能描述: 利用文件输入输出流编写一个实现文件拷贝的程序,源文件名和目标文件名通过控制台输入. public static void main(String[] args) { Scanner in= ...

  10. Flink-v1.12官方网站翻译-P009-Event-driven Applications

    事件驱动的应用 处理函数 简介 ProcessFunction将事件处理与定时器和状态结合起来,使其成为流处理应用的强大构件.这是用Flink创建事件驱动应用的基础.它与RichFlatMapFunc ...