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. Redis-第六章节-事务

    目录 简介 执行过程 特点 案例 watch 简介 事务(Transaction),一般是指要做的或所做的事情.在计算机术语中是指访问并可能更新数据库中各种数据项的一个程序执行单元(unit). 执行 ...

  2. Codeforces Round #671 (Div. 2) (A~E)

    Link~ 题面差评,整场都在读题 A 根据奇偶性判断一下即可. #include<bits/stdc++.h> #define ll long long #define N #defin ...

  3. new的过程是怎样的?看完这一篇就懂了

    在现实世界中,找对象是一门学问,找对象不在于多而在于精 在计算机世界中,面向对象编程的关键在于能否灵活地运用类,如何设计出一个符合需求的对象也是也是值得学习和思考的. 那么,面向对象编程到底是什么? ...

  4. 重绘和回流(Repaint & Reflow)总结,以及如何进行优化

    1. 浏览器渲染机制 浏览器采用流式布局模型(Flow Based Layout) 浏览器会把HTML解析成DOM,把CSS解析成CSSOM,DOM和CSSOM合并就产生了渲染树(Render Tre ...

  5. Quartz:定时任务工具类

    Quartz:定时任务工具类 Quartz工具类 Quartz工具类 import org.quartz.*; import org.quartz.impl.StdSchedulerFactory; ...

  6. 27.SELinux 安全子系统

    1.SELinux(Security-Enhanced Linux)是美国国家安全局在Linux 开源社区的帮助下开发的一个强制访问控制(MAC,Mandatory Access Control)的安 ...

  7. 配置七牛云图床 + Typora

    配置七牛云图床工具 使用图床+Typora可以方便快捷的撰写图文博客 我这里以七牛云进行示例,讲解如何去配置 七牛云是属于收费图床,目前还在测试,不过对于使用量不大的我来说应该免费是足够了的,不过需要 ...

  8. Flink-v1.12官方网站翻译-P012-Stateful Stream Processing

    有状态的流处理 什么是状态? 虽然数据流中的许多操作一次只看一个单独的事件(例如事件解析器),但有些操作会记住多个事件的信息(例如窗口操作符).这些操作被称为有状态操作.一些有状态操作的例子. - 当 ...

  9. zoj3494 BCD Code(AC自动机+数位dp)

    Binary-coded decimal (BCD) is an encoding for decimal numbers in which each digit is represented by ...

  10. 【POJ 2411】【Mondriaans Dream】 状压dp+dfs枚举状态

    题意: 给你一个高为h,宽为w的矩阵,你需要用1*2或者2*1的矩阵填充它 问你能有多少种填充方式 题解: 如果一个1*2的矩形横着放,那么两个位置都用二进制1来表示,如果是竖着放,那么会对下一层造成 ...