js 面试题--事件循环event loop--宏任务和微任务

1 事件循环event loop概念:

js 是非阻塞单线程语言,js在执行过程中会产生执行环境,执行环境会按顺序添加到执行栈中,先执行同步栈中的任务,当遇到异步任务时会添加到task队列中,同步栈执行完后,会执行异步队列,event loop会从异步(task)队列中提取要执行的代码放到执行栈中,这个过程叫事件循环。

2 宏任务和微任务

原则:先进先出原则。

异步又分为宏任务和微任务,执行顺序是先执行微任务,在执行宏任务如下图:

2-1 宏任务和微任务代码:

        注意:Promise本身是同步代码,但他的回调then,catch属于异步--微任务

3 案例

console.log('a')

setTimeout(()=>{
        console.log('b')
},0)

const o = new Promise((resolve,reject)=>{
        console.log('c')
        resolve(true)

        console.log('d')
})
o.then(res=>{
        console.log('e')
})
console.log('f')

结果是:a , c, d, f, e

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mfbz.cn/a/414855.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

Python学习系列 -初探标准库之logging库

系列文章目录 第一章 初始 Python 第二章 认识 Python 变量、类型、运算符 第三章 认识 条件分支、循环结构 第四章 认识 Python的五种数据结构 第五章 认识 Python 函数、模块 第六章 认识面向对象三大特性 第七章 初探标准库之os库 第八章 初探标准库之pathlib库 第九章 初探…

【数据结构(C语言)】排序详解

目录 文章目录 前言 一、排序的概念 1.1 排序的概念 1.2 常见的排序算法 二、插入排序 2.1 直接插入排序 2.1.1 基本思想 2.1.2 特性总结 2.1.3 代码实现 2.2 希尔排序 2.2.1 基本思想 2.2.2 特性总结 2.2.3 代码实现 三、选择排序 3.1 直接选择排序 3.1.1…

【数据结构和算法初阶(C语言)】空间复杂度(例题剖析一起探究空间如何评价算法)

目录 1.衔接前言-时间复杂度的回顾 2.关于算法复杂度 3.本文主角-空间复杂度 3.1大O的渐进表示方法 4.空间复杂度例题----实际感受空间复杂度 4.1冒泡排序的空间复杂度 4.2计算递归函数的空间复杂度 4.3动态开辟内存版本求斐波那契数列的空间复杂度 4.4(…

蓝桥杯_定时器的基本原理与应用

一 什么是定时器 定时器/计数器是一种能够对内部时钟信号或外部输入信号进行计数,当计数值达到设定要求时,向cpu提出中断处理请求,从而实现,定时或者计数功能的外设。 二 51单片机的定时/计数器 单片机外部晶振12MHZ,…

如何实现双向循环链表

博主主页:17_Kevin-CSDN博客 收录专栏:《数据结构》 引言 双向带头循环链表是一种常见的数据结构,它具有双向遍历的特性,并且在表头和表尾之间形成一个循环。本文将深入探讨双向带头循环链表的结构、操作和应用场景,帮…

el-table通过这样封装可以实现校验-表格校验的原理

我们一般在后台系统中&#xff0c;很常见的操作时表格里面嵌套表单&#xff0c;之前我的网上找到了一些封装的用法&#xff1a; <el-form :model"formData" :rules"ruleData" ref"formDom"><el-table :data"formData.tableData&q…

Vue.js入门指南:简介、环境配置与Yarn创建项目

一、Vue.js简介 Vue.js&#xff0c;一个流行的JavaScript框架&#xff0c;以其直观、灵活和高效的特点&#xff0c;在前端开发者中赢得了广泛的赞誉。Vue.js的核心库专注于视图层&#xff0c;使得开发者能够构建出响应式的数据绑定和组合的视图组件。Vue.js的目标是通过尽可能简…

CPU、GPU 混合推理,非常见大模型量化方案:“二三五六” 位量化,模型量化详细实现方案

CPU、GPU 混合推理&#xff0c;非常见大模型量化方案&#xff1a;“二三五六” 位量化&#xff0c;模型量化详细实现方案。 非常见整型位数的量化&#xff0c;来自让各种开源模型能够在 CPU 环境、CPU & GPU 环境混合推理的技术方案&#xff1a;llama.cpp 。为了能够在低配…

iOS群控软件功能分析与代码分享!

随着移动互联网的迅猛发展&#xff0c;iOS设备作为市场上一大主流平台&#xff0c;其应用开发和管理越来越受到开发者和企业的重视&#xff0c;iOS群控软件&#xff0c;作为一种能够批量控制、管理和监控iOS设备的工具&#xff0c;逐渐展现出其强大的实用价值。 本文将详细分析…

React回顾

一、基础 1、使用babel解析 2、不直接使用jsx&#xff0c;jsx写起来很繁琐 3、jsx语法规则 4、函数式组件的使用 5、函数式组件渲染 6、类组件渲染 7、类组件中事件调用this指向问题 8、类组件不能直接改变状态 9、props接收数据类型限制 类型限制放到类组件内部&#xff0c;用…

StarRocks实战——滴滴OLAP的技术实践与发展方向

原文大佬的这篇StarRocks实践文章整体写的很深入&#xff0c;介绍了StarRocks数仓架构设计、物化视图加速实时看板、全局字典精确去重等内容&#xff0c;这里直接摘抄下来用作学习和知识沉淀。 目录 一、背景介绍 1.1 滴滴OLAP的发展历程 1.2 OLAP引擎存在的痛点 1.2.1 运维…

IOC 和 AOP

IOC 所谓的IOC&#xff08;inversion of control&#xff09;&#xff0c;就是控制反转的意思。何为控制反转&#xff1f; 在传统的程序设计中&#xff0c;应用程序代码通常控制着对象的创建和管理。例如&#xff0c;一个对象需要依赖其他对象&#xff0c;那么它会直接new出来…

express+mysql+vue,从零搭建一个商城管理系统6--数据校验和登录

提示&#xff1a;学习express&#xff0c;搭建管理系统 文章目录 前言一、修改models/user.js二、修改routes下的user.js三、Api新建user/login接口四、删除数据库原有数据&#xff0c;添加新验证规则的用户四、用户登录总结 前言 需求&#xff1a;主要学习express&#xff0c;…

【Linux】基础篇-Linux四种环境搭建的方式(详细安装说明步骤,搭载下载安装地址)

目录 1. 使用虚拟机&#xff08;推荐VMware&#xff09;centos 7版本 1.1VMware虚拟机下载 1.2VMware 安装 1.3centos-7 清华大学镜像下载 1.4 centos-7 清华大学镜像导入虚拟机VMware 2.使用虚拟机ubuntu 20.04版本 2.1虚拟机下载同上 2.2虚拟机安装同上 2.3ubunt…

ROS-Ubuntu 版本相关

ROS-Ubuntu 版本相关&#xff1a;安装指引 年代ROS1版本Ubuntu 版本2014Indigo14.042016Kinetic16.042018Melodic18.042020Noetic20.04 & 22.04 ROS2兼顾了工业使用上的问题。 年代ROS2版本Ubuntu 版本2022Humble20.04 & 22.042023Iron16.04 相关参考&#xff1a; […

【Qt 学习之路】使用 cmake 在Windows上 编译 ZeroMQ

文章目录 1、概述2、编译2.1、用 Visual Studio 的解决方案方式2.1.1、找到 Builds 文件夹2.1.2、查看 deprecated-msvc 下的 libzmq.sln 文件2.1.3、使用 Visual Studio 打开 libzmq.sln 解决方案2.1.4、修改 libzmq.import.props 文件2.1.5、编译生成 2.2、用 C 的cmake方式2…

【前端入门】设计模式+单多页+React

设计模式是一种解决特定问题的经验总结&#xff0c;它提供了经过验证的解决方案&#xff0c;可以在软件开发过程中使用。设计模式可以帮助前端开发人员更有效地组织和管理代码&#xff0c;并提供一种共享的语言和框架&#xff0c;以便与其他开发人员进行交流。 以下是一些常见…

十二、Qt自定义Widget组件、静态库与动态库

一、自定义Widget组件 1、自定义Widget组件 使用步骤采用提升法&#xff08;promotion&#xff09;重新定义paintEvent事件 2、实现程序 &#xff08;1&#xff09;创建项目&#xff0c;基于QWidget &#xff08;2&#xff09;添加类&#xff0c;为Widget组件提升类 #inclu…

Delegate(P29 5.5delegate)

一、Delegate简介 每个代理都可以访问许多附加的属性&#xff0c;其中一些来自数据模型&#xff0c;另一些来自视图。 从模型中&#xff08;Model&#xff09;&#xff1a;属性将每个项目的数据传递给 delegate。 从视图中&#xff08;View&#xff09;&#xff1a;属性将状…

dcat admin 自定义页面

自定义用户详情页 整体分为两部分&#xff1a;用户信息、tab框 用户信息采用自定义页面加载&#xff0c;controller代码如下&#xff1a; protected function detail($id) {return Show::make($id, GameUser::with(finance), function (Show $show) {// 这段就是加载自定义页面…