• js的线程问题


    主动学习。

    同步异步代码

    同步代码:按书写顺序执行,立即放入JS引擎(JS主线程)执行,并原地等待。
    异步代码:先放入宿主环境(浏览器/Node),不必原地等待,并不阻塞主线程继续往下执行,异步结果在将来执行。
    异步操作有:计时器(setTimeout,setInterval),网络请求(ajax),读取文件,then,鼠标键盘触发事件
    区别:异步不会阻塞程序的执行;同步会阻塞程序的执行。

    同步代码执行完成之后再执行异步代码。

    console.log(1);
    setTimeout(function(){console.log(2)},0);
    setTimeout(function(){console.log(3)},0);
    console.log(4);
    
    输出1423
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    		for(let i=0;i<2000;i++){
                console.log(1);
            }
            setTimeout(function(){console.log(2)},0);
            setTimeout(function(){console.log(3)},0);
            console.log(4);
            //输出2000个1,再输出423
            //如果2插入2000个1中输出说明代码是同时执行的,不是按照顺序执行的了。
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8

    单线程

    JS是单线程的,一个任务完成之后才能执行另一个任务。

    setImmediate(()=>{//只能在js文件中运行
        console.log(1);
    })
    process.nextTick(()=>{
        console.log(2);
    });
    console.log(3);
    setTimeout(()=>{
        console.log(4)
    },0);
    console.log(5);
    //输出35241
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12

    事件循环(event loop)

    同步代码放入运行栈
    异步代码放入任务队列
    :同步代码放入运行栈中,异步代码在时间到之后放入任务队列中。
    执行栈中的任务清空后,再读取任务队列。
    事件循环一直检测任务队列中是否有任务,有则执行。
    (因为异步代码在时间到之后放入任务队列中,而不是立即执行,因此计时器有时候不是很准。)
    该过程循环执行。

    JS是单线程,防止代码阻塞,我们把代码分为同步和异步
    同步代码给JS引擎(JS主线程)执行,异步代码交给宿主环境(浏览器/Node)
    同步代码放入执行栈中,异步代码等到时机成熟(如计时器到)再送入任务队列排队
    执行栈中的代码执行完毕,会去任务队列查看是否有异步任务,有就送到执行栈中执行,反复循环查看执行,这个过程就是事件循环。

    宏任务与微任务

    js将异步任务又分为了宏任务和微任务。

    宏任务:计时器,ajax,读取文件,script(整体代码)
    微任务:promise.then,.catch, .finally

    执行顺序:
    1.同步程序
    2.process.nextTick
    3.微任务
    4.宏任务
    5.setImmediate

    		setImmediate(() => {
                console.log(1)
                })
            console. log(2);
            setTimeout(() => {console.log(3)},0);
            setTimeout(() => {console . log(4)},100);
            console. log(5);
            new Promise((resolve) => { 
                console.log(6)
                resolve( )//调用resolve的时候执行then,否则不执行then
            }).then(() => {
                console.log(7)
            })
            process. nextTick(() => {
                console . log(8)
            })
    输出25687314
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17

    js引擎又叫js内核,负责处理js脚本程序。
    为了利用多核CPU的能力,HTML5提出Web Worker标准,允许JS脚本创建多个线程,但是子线程完全受主线程控制,且不得操作DOM。这个新标准并没有改变js单线程的本质。

  • 相关阅读:
    【SpringBoot整合NoSql】-----MongoDB篇
    【2022秋招面经】——数据库
    项目管理逻辑:日志\周报\月报, 一直要求写, 有用吗?
    使用Maven 构建、开发和打包 JavaFX 项目
    如何备份VMware虚拟机
    从技术创新到应用实践,百度智能云发起大模型平台应用开发挑战赛!
    git命令学习
    掌握这五点建议,Linux学习不再难
    MATLAB中uiresume函数用法
    【含java2023面试题】HashMap、HashTable、ConcurrentHashMap
  • 原文地址:https://blog.csdn.net/EmilyHoward/article/details/127912439