setTimeout和setInterval原理

最新推荐文章于 2024-05-21 14:15:14 发布
最新推荐文章于 2024-05-21 14:15:14 发布
阅读量1.1k 收藏
点赞数
分类专栏： Javascript 文章标签： javascript JavaScript Javascript javaScript JAVASCRIPT setTimeout

setTimeout触发的方式不是用中断的方式，也就是setTimeout并不是我们所想象的那样是真正定时触发程序的，和真实值相比是有延时的，

setTimeout的js内部原理：

        js内部自身维护一个数组，我们就命名为eventArray吧，当执行到setTimeout语句时，js就将setTimeout的回调函数推入eventArray同时记录了当前的时间戳和定时时间(intervalDate)，因为js是单线程的程序，所以只有一个主程序在解析编译和运行代码，每当主程序空闲的时候会不断去访问eventArray，判断当前时间和eventArray内的成员的currentDate属性和当前时间戳间隔是否大于成员的intervalDate(当然这只是简单描述下实际机制比这个复杂)，大于间隔就从数组中取出并执行callback。

setInterval 同理

原文：Johnny Home：setTimeout原理

bugknightyyp
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
setInterval和setTimeout停止的方法
09-05
要想知道它们是怎么停止的，首先我们要了解它们的运行机制和原理，下面是具体的介绍。
js基于setTimeout与setInterval实现多线程
10-22
主要介绍了js基于setTimeout与setInterval实现多线程的方法,分析了多线程的原理与javascript模拟实现多线程的相关技巧,需要的朋友可以参考下
JavaScript———从setTimeout与setInterval到AJAX异步
weixin_30663471的博客
02-08 85
setTimeout与setInterval执行 　　首先我们看一下以下代码打印结果 　　console.log(1); 　　setTimeout(function() { console.log(2); },100) 　　setTimeout(function() { console.log(3); },50) 　　console.log(4); 　　打印结果是...
JavaScript定时器原理分析
weixin_34072637的博客
11-26 127
JavaScript中的定时器大家基本在平时的开发中都遇见过吧，但是又有多少人去深入的理解其中的原理呢？下面我们就来分析一下定时器的实现原理。 一、储备知识 在我们在项目中一般会遇见过这样的两种定时器，第一种是setTimeOut,第二种是setInterval，这两种定时器有如下的区别： 1、setTimeout允许设置一个超时对象，超时后执行这个对象，但是只执行一次，无周期 2、s...
Javascript是单线程的深入分析
weixin_33985507的博客
02-17 238
面试的时候发现99%的童鞋不理解为什么JavaScript是单线程的却能让AJAX异步发送和回调请求，还有setTimeout也看起来像是多线程的？还有non-blocking IO, event loop等概念很不清楚。来深入分析一下： 首先看下面的代码： function foo() { console.log( 'first' ); setTimeout( ( fun...
setTimeout理解
weixin_41989250的博客
02-17 5702
如果在设定的时间内，发生新的keydown事件，则不触发Ajax通信，并且重新开始计时。所以上面的代码执行流程是：JS执行到setTimeout时，将其交给浏览器去计时（哪怕时间是0），然后去执行同步的for循环，因为例子中的for循环执行需要5s左右，在for循环执行3秒时，浏览器已经把之前的计时器计时完毕，然后推送到JS的事件队列里，当做下一个task任务执行，当前任务(for循环)不受影响，当for循环结束后，JS线程空了，然后去事件队列中取微任务或者新的任务(setTimeout)，然后执行。
关于 setTimeout 与 setInterval 的 4 点重要区别
学海无涯，回头是岸
07-15 1471
一、执行机制导致的延迟时间有误 有时我们对事件设定的执行延迟，并没达到预想的时间节点后执行。这是由于JS是单线程的，需遵循事件队列机制，setTimeout和setInterval的回调会到延迟时间后塞入事件队列中，排队执行。 示例： for(var i = 0; i < 5; i++){ setTimeout(()=> console.log(i),0) } 在这里插入代码片 二、 ...
详解setTimeout()
Moments
01-30 2万+
前言：看了这篇文章，1.注意setTimeout引用的是全部变量还是局部变量了，当直接调用外部函数方法时，实际上函数内部的变量已经变成全局。2.提醒我防止出错的，用匿名函数不容易出错。3.setTimeout最快执行时间是4毫秒。4.使用setTimeout的函数会比当前队列的函数慢执行，在他们的后面。5.setTimeout中的定时器并不是准确的时间，实际中它需要在执行完前面的函数后才定时执行。 你还可以查阅关于setTimeout的相关介绍 JavaScript提供定时执行代码的功能，叫做定时器（tim
setTimeout 详解
热门推荐
Dark_programmer的博客
03-30 4万+
1. setTimeout 定义 setTimeout( )是属于 window 的 method, 但我们都是略去 window 这顶层物件名称, 这是用来设定一个时间, 时间到了, 就会执行一个指定的 method。 setTimeout()方法设置一个定时器，该定时器在定时器到期后执行一个函数或指定的一段代码。 2. 参数详解 刚刚在研究promise的时候，发现setTimeout( )不...
关于javascript里的setTimerout()-设定时间
weixin_30879169的博客
01-01 824
setTimerout(Timer code, Timer delay) ; 解说： 可制作（单次）定时器的内置函数； 函数需要的两项信息，分别是时间延迟与定时器停止欲运行的程序代码； 演示代码： setTimerout("alert('Wake Up'));", 60000); 转载于:https://www.cnblogs.com/kojya/archive/201...
JavaScrip单线程引擎工作原理分析
12-11
从基础的层面来讲，理解JavaScript的定时器是如何工作的是非常重要的。定时器的执行常常和我们的直观想象不同，那是因为JavaScript引擎是单线程的。我们先来认识一下下面三个函数是如何控制计时... 和setTimeout有些类
vue项目每30秒刷新1次接口的实现方法
12-01
在vue.js项目中，经常需要对数据实时更新——每隔xx秒需要刷新一次接口——即需要用到定时器相关原理 我们先看一看2种常用定时器： setInterval(function(){}, milliseconds)——会不停的调用函数 setTimeout...
异步执行的原理
01-20
setInterval setTimeout 事件的绑定 onclick… ajax请求 所谓异步程序的执行 1,所有的异步程序的执行,都会在同步程序执行结束之后,再来执行 2,异步程序的执行顺序,如果时间相同,看代码的先后顺序 如果时间不同,时间...
setTimeout与setInterval详解
前端成长之路
11-12 467
window.setTimeout(“Fun”, time); 超时调用：在指定时间后执行函数内的代码 接收两个参数：函数体或者字符串（不建议使用字符串）、指定时间（毫秒为单位） 在指定时间后只执行一次，如果需要重复执行需要在函数体内再调用一次setTimeout <!--文本框内的数字每过1秒加1--> <input type="text" id="txt" value="...
【转】Javascript异步编程之setTimeout与setInterval
weixin_34167043的博客
08-17 142
Javascript异步编程之setTimeout与setInterval 转自：http://www.tuicool.com/articles/Ebueua 在谈到异步编程时，本人最主要会从以下三个方面来总结异步编程(注意：特别解释：是总结，本人也是菜鸟，所以总结不好的，请各位大牛多多原谅！) 1. setTimeout与setInterval详细分析基本原理。 接下来这...
setTimeout，setInterval原理
weixin_30522095的博客
08-22 65
function a() { setTimeout(function(){alert(1)},0); alert(2); } a(); 和其他的编程语言一样，Javascript中的函数调用也是通过堆栈实现的。在执行函数a的时候，a先入栈，如果不给alert(1)加setTimeout，那么alert(1)第2个入栈，最后是alert(2)。但现在给alert(...
js基础之setTimeout与setInterval原理分析
夕山雨的博客
07-06 5530
基本原理 setTimeout(func, delay, args)：设置超时调用，经过delay时间后，将func函数加入到执行队列中准备调用。如果队列为空，立即执行该函数，否则等待线程空闲再执行。 setInterval(func, interval, args)：设置 ...
14.1 setTimeout和setInterval的使用
k的专栏
12-11 1038
14.1  setTimeout和setInterval的使用这两个方法都可以用来实现在一个固定时间段之后去执行JavaScript。不过两者各有各的应用场景。 方 法实际上，setTimeout和setInterval的语法相同。它们都有两个参数，一个是将要执行的代码字符串，还有一个是以毫秒为单位的时间间隔，当过了那个时间段之后就将执行那段代码。不过这两个函数还是有区别的，set
openlayers绘制经纬网格，有添加或者移除功能
最新发布
qq_52959651的博客
05-21 202
我的项目是vue写的，当点击多选框显示隐藏经纬网格，下面直接写代码。项目需要在地图中添加经纬网格，然后看了一下官网有相关的介绍。这是删除图层相关的网站。这是绘制经纬网格方法。
settimeout与setinterval的原理
09-16
setTimeout和setInterval都是JavaScript引擎提供的定时器方法。setTimeout主要用于需要进行延时调用的场景，而setInterval则用于循环调用函数。 setTimeout的运行机制是将函数添加到任务队列中，指定的时间间隔后...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值