• JS基础--任务队列和事件循环



    任务队列

    任务指的就是js代码中的运行的代码。
    JS中的所有任务分两种:同步任务和异步任务
    同步任务指的是: 主线程上的任务排队执行
    异步任务指的是: 不进入主线程,而是进入一个"任务队列"的任务,当主线程中的任务执行完,才会从任务队列中取出异步任务放入主线程执行
    异步任务又可分为:异步宏任务和异步微任务。
    异步宏任务比如:定时器等。异步微任务:Promise等。官方规定的;

    实现异步模式的方法有很多,比较常用的有:
    (1)延迟类:setTimeout、setInterval、requestAnimationFrame、setImmediate。
    (2)监听事件实现的类型:监听new Image加载状态、监听script加载状态、监听iframe加载状态、Message。
    (3)带有异步功能类型 Promise、ajax等等。

    案例

            setTimeout(()=>{              //setTimeout是添加了一个异步宏任务 等同步任务和异步微任务执行完后执行
                console.log(11111)     
            },1000)
           let p=new Promise((n1,n2)=>{
               n1(22222)    
           })
           p.then((n1)=>{       //Promise的then方法是添加一个异步微任务,等本轮同步任务执行后执行
                console.log(n1)
           })
           console.log(33333)  //同步任务,最先执行 打印33333
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10

    在这里插入图片描述

    事件循环

    当javascript代码执行的时候会将不同的变量存于内存中的不同位置:堆(heap)和栈(stack)中来加以区分。其中,堆里存放着一些对象。而栈中则存放着一些基础类型变量以及对象的指针。

    当我们调用一个方法的时候,js会生成一个与这个方法对应的执行环境,又叫执行上下文。而当一系列方法被依次调用的时候,因为js是单线程的,同一时间只能执行一个方法,于是这些方法被排队在一个单独的地方。这个地方被称为执行栈

    js引擎遇到一个异步事件后并不会一直等待其返回结果,而是会将这个事件挂起,继续执行执行栈中的其他任务。
    当这个异步事件返回结果后,js会将这个事件加入与当前执行栈不同的另一个队列,我们称之为事件队列(任务队列)

    被放入事件队列不会立刻执行其回调,而是等待当前执行栈中的所有任务都执行完毕, 主线程处于闲置状态时,主线程会去查找事件队列是否有任务。
    如果有,那么主线程会从中取出排在第一位的事件,并把这个事件对应的回调放入执行栈中,然后执行其中的同步代码…,如此反复,这样就形成了一个无限的循环。这就是这个过程被称为“事件循环”的原因。
    执行栈则是一个类似于函数调用栈的运行容器。当执行栈为空时,JS 引擎便检查事件队列,如果不为空的话,事件队列便将第一个任务压入执行栈中运行。
    这种不停的检查事件队列的操作,成为事件循环
    在这里插入图片描述

  • 相关阅读:
    <SQL>《SQL命令(含例句)精心整理版(4)》
    南大通用GBase8s 常用SQL语句(256)
    HDC2022重磅发布“鸿蒙赋能全家桶”,开发者的新时代要来了?
    23.11.19日总结(vue2和vue3的区别,项目中期总结)
    Netty从入门到实战
    踩坑记录(21--更新中)
    List 常见实现类源码解析:ArrayList、LinkedList、Vector
    GC 算法与种类
    【AIGC调研系列】copilot在自动化测试脚本中的实际应用效果
    #Paper Reading# Pre-trained Language Model based Ranking in Baidu Search
  • 原文地址:https://blog.csdn.net/qq_56973906/article/details/125770774