js后面代码停止一秒执行_JS事件循环机制

最新推荐文章于 2024-07-02 17:59:10 发布

weixin_39946239

最新推荐文章于 2024-07-02 17:59:10 发布

阅读量4.3k

点赞数

文章标签： js后面代码停止一秒执行

本文链接：https://blog.csdn.net/weixin_39946239/article/details/112077478

版权

JS中存在一个叫做执行栈的东西。JS的所有同步代码都在这里执行，当执行一个函数调用时，会创建一个新的执行环境并压到栈中开始执行函数中的代码，当函数中的代码执行完毕后将执行环境从栈中弹出，当栈空了，也就代表执行完毕。

这里有一个问题是代码中不只是同步代码，也会有异步代码。当一个异步任务执行完毕后会将任务添加到任务队列中。例如：

setTimeout(_=>{}, 1000)

代码中setTimeout会在一秒后将回调函数添加到任务队列中。事实上异步队列也分两种类型：微任务、宏任务。

微任务和宏任务的区别是，当执行栈空了，会检查微任务队列中是否有任务，将微任务队列中的任务依次拿出来执行一遍。当微任务队列空了，从宏任务队列中拿出来一个任务去执行，执行完毕后检查微任务队列，微任务队列空了之后再从宏任务队列中拿出来一个任务执行。这样持续的交替执行任务叫做事件循环。

属于微任务（microtask）的事件有以下几种：

Promise.then
MutationObserver
Object.observe
process.nextTick

属于宏任务（macrotask）的事件有以下几种：

setTimeout
setInterval
setImmediate
MessageChannel
requestAnimationFrame
I/O
UI交互事件

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

weixin_39946239

关注关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

细聊 JavaScript 的事件执行机制

FOR 的博客

04-14

561

细聊 JavaScript 的事件执行机制我使用的 Node.js 版本是 v12.13.0 的， 11 的版本前会与11 版本后的事件循环有些区别。线程？都说 JavaScript 是单线程的，那么什么是单线程呢？单线程就是进程只有一个线程。那这又扯到进程这个概念了。进程进程（Process）：进程是一个具有独立功能的程序关于某个数据集合的一次运行活动。它可以申请和拥有系统资源，是一个动态的概念，是一个活动的实体。它不只是程序的代码，还包括当前的活动，通过程序计数器的值和处理寄

js延迟1秒钟

weixin_42596011的博客

01-14

6759

使用 JavaScript 的 setTimeout() 函数可以实现延迟 1 秒钟执行某个函数。 setTimeout(function(){ // your code here }, 1000); 第一个参数是要执行的函数，第二个参数是延迟的时间，单位是毫秒，所以上面的代码延迟了 1 秒钟才执行。 ...

参与评论您还未登录，请先登录后发表或查看评论

浅析setTimeout与Promise

weixin_34185320的博客

08-12

146

关于JavaScript异步编程，前文解析过了JavaScript并发模型，该并发模型基于事件循环。正巧又在Stackoverflow上回答了一个关于setTimeout与Promise执行顺序相关的问题，于是总结这一知识点，与更多读者分享，同时完善JavaScript异步编程系列文章。我的个人博客前言我们先看一到常见的前端面试题： var p1 = new Promise(function...

js每1秒重复执行一段代码

最新发布

qq_33240556的博客

07-02

729

函数代表你希望每秒执行的任务，你可以根据需要修改这个函数内部的逻辑。在JavaScript中，要实现每1秒重复执行一段代码，可以利用。函数，我们将这个函数的执行间隔设置为了1000毫秒（1秒）。会返回一个ID，用于后续如果需要停止定时执行时，传递给。

setTimeout和promise

2197

08-06

3136

1>两个异步队列不一样，promise所在的异步队列优先级要高一点。 setTimeout(function(){ console.log(1); },0); new Promise(function executor(resolve){ resolve(); }).then(function(){ console.log(2); })//2,1 解释下面的代码：创建promis...

Promise与setTimeout

CodingBleeding的博客

10-15

2296

Promise是ES6新提出的概念，可以把它看作是异步操作和回调函数的中转站，或者是保存异步操作结果的容器。通过Promise，可以将异步操作通过同步流程表现出来。具体介绍参考ESMAScript6 入门。之前在网上看到一道题目： (function test() { setTimeout(function() {console.log(4)}, 0); new Promise(functi

浅谈Promise与Settimeout

qq_48314377的博客

07-23

908

Promise和setTimeout

js让for循环延迟一秒执行

06-06

在中，for循环延迟一秒执行可以通过使用setTimeout函数来实现。具体代码如下： ``` for (let i = 0; i ; i++) { setTimeout(function() { console.log(i); }, i * 1000); } ``` 这段代码会输出数字0到9，每个...

jQuery及JS实现循环中暂停的方法

12-12

本文实例讲述了jQuery及JS实现循环中暂停的方法。分享给大家供大家参考。具体分析如下：问题： jquery对数组进行循环，如果要求每次循环的时候暂停2秒钟，在使用jQuery的.earch循环的时候，无论怎么设置，都不会...

js实现多张图片每隔一秒切换一张图片

12-12

标题中的“js实现多张图片每隔一秒切换一张图片”指的是使用JavaScript编程技术来设计一个功能，使得网页上的一组图片能够自动按照设定的时间间隔（这里是1秒钟）进行轮播，即每隔1秒自动切换到下一张图片。...

3 JS 循环定时器的停止

jiangjun_feng的博客

07-18

1129

1.代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>倒计时停止</title> </head> <body> <span id="time"></span> <script> var second=100; var show; var f

JavaScript作用域----全局作用域、函数作用域

weixin_46452134的博客

12-20

604

作用域是指一个变量的作用范围，在JS中一共有两种作用域：全局作用域和函数作用域（整体与局部的关系）。全局作用域直接编写在script标签中的Js代码都是全局作用域例： <script type="text/javascript"> var a = 1; var b = 2; var c = 3; </script> 例子中变量a、b、c都是全局作用域全局作用域在页面打开时创建，在页面关闭时销毁在全局作用域中有一个全局对象window，它代表的是一个浏览器的窗口

最简单快速理解Promise与setTimeout

Nana_9457的博客

03-06

1995

Promise MDN上的例子稍稍变化： var p = new Promise(function(resolve, reject){ setTimeout(function(){ resolve(&amp;quot;foo&amp;quot;); console.log(&amp;quot;first&amp;quot;); }, 1000); }); p.then(function(value){ console.log(v

setTimeout和Promise区别（宏任务和微任务）

热门推荐

RistonTea的博客

10-10

1万+

javascript的宏任务和微任务宏任务有Event Table、Event Queue，微任务有Event Queue 1.宏任务：包括整体代码script，setTimeout，setInterval； 2.微任务：Promise，process.nextTick 注：Promise立即执行，then函数分发到微任务Event Queue，process.nextTick分发到微任...

js 每秒刷新系统时间，可停止

weixin_34313182的博客

12-25

107

<title>无标题页</title> <script language="javascript" type="text/javascript"> var t; function show() { var date = new Date(); //日期对象 var now = ""; now = date.getFullYear() + "年"

vuex commit 模块_请简述一下vuex实现原理

weixin_39866265的博客

12-13

327

请简述一下vuex实现原理vuex实现原理我们简单过一遍源码地址首先我们例出几个问题进行思考store是怎么注册的?mutation，commit 是怎么实现的?辅助函数是怎么实现的?store是怎么注册的看了下面的源码就很清楚了，我们看到vuex在vue 的生命周期中的初始化钩子前插入一段 Vuex 初始化代码。给 Vue 的实例注入一个 $store 的属性，这也就是为什么我们在 Vue...

setTimeout、Promise 性能比较

chengRantianxia的博客

07-27

1710

setTimeout 属于宏任务（MacroTask）， Promise 属于微任务（MicroTask），二者并不在一个异步队列中。无论是宏任务还是微任务，都是异步任务。在 JavaScript 中的异步是靠事件循环来实现的，拿大家最常见的 setTimeout 为例。 // 同步代码 let count = 1; setTimeout(() => { // 异步 count = 2; }, 0); // 同步 count = 3; 一个异步任务会被丢到事件循环的队列中..

setTimeout与promise基础

空那个白的博客

08-17

1175

说来惭愧，一直用async/await，但是却没有懂到底是干啥的。。。感谢大佬最近指导了一波，总算知道了最基础的该怎么用。。。先来说说同步和异步吧~~~ 通俗点理解~~~ 同步：得按顺序一个一个来，如果中途有一个耗时很长，那后面也都得等着（遵循先来后到）异步：当前异步函数可以先搁置一边慢慢执行，先执行后面的。。。 setTimeout延时，如果想让延时的按顺序一步一步执行怎么解决...

JavaScript中的Promise与setTimeout执行顺序解析

里查叔叔

03-16

1082

Promise对象代表一个异步操作的最终完成或失败，及其结果值的状态。当我们在代码中同时使用Promise和setTimeout时，由于Promise是微任务（microtask），而setTimeout是宏任务（macrotask），根据JavaScript的事件循环机制，微任务会优先于宏任务执行。由于Promise链中的每个步骤都是异步的，并且微任务会在当前宏任务执行完毕后立即执行，因此Promise链中的代码通常会先于setTimeout中的代码执行，即使setTimeout的延迟时间被设置为0。