• 宏任务与微任务


    /*

    js是单线程,所以也可以说是主线程,所以js代码都是在主线程执行的,
    只不过我们要区分它是同步执行还是异步执行;
    当一个代码是异步的话,对应的是回调函数。
    不同的任务对应不同的回调,比如:定时器的回调,发送js的回调,对应事件的回调
    定时器模块,网络请求模块,事件处理模块,回调的执行取决于模块什么时候将回调函数放入到事件队列eq,
    js引擎会通过轮询方式去询问这个事件队列是否有可执行的回调,如果有,就会将函数钩出去,钩到主线程去执行。
    所以回调函数也叫钩子函数。
    *
    * */


    /*
    宏任务
    分类:setTimeout setInterval
    requestAnimationFrame(用于提前告诉提醒浏览器我们将要在下一次进行动画之前,帮我们调用对应的回调函数)
    * 它们都是异步任务的同时又是宏任务
    *
    * 1.宏任务所处的队列就是宏任务队列
    * 2.第一个宏任务队列只有一个任务:执行主线程的js代码
    * 3.宏任务队列可以有多个
    * 4.当宏任务队列中的任务全部执行完之后会查看是否有微任务,
    * 有则先执行微任务队列中的所有任务,
    * 没有则查看是否有宏任务队列
    * */

    /*
    微任务
    * 分类:new Promise().then(回调) process.nextTick
    * 1.微任务所处的队列就是微任务队列
    * 2.只有一个微任务队列
    * 3.在上一个宏任务队列执行完毕后如果有微任务队列就会执行微任务队列中的所有任务
    * */


    console.log('------start---');//宏任务1,这个执行完,下一步会优先处理微任务。
    setTimeout(()=>{//宏任务2
    console.log('setTimeout');
    },0)

    new Promise((resolve,reject)=>{//微任务,需要处理完微任务队列的所有任务才能返回处理第二个宏任务。
    for(var i=0;i<5;i++){
    console.log(i);
    }
    resolve();//修改promise实例对象的状态为成功的状态
    }).then(()=>{
    console.log('promise实例成功回调执行');
    })
    console.log('-----end----')//
    //输出结果:------start---
    //0,1,2,3,4,
    //-----end----
    //promise实例成功回调执行
    //setTimeout

  • 相关阅读:
    es6实现简单模板编译
    JavaScript实现自定义短信模板
    关于JavaScript设计模式的学习(二)
    js获取可编辑区域光标位置
    关于JavaScript设计模式(一)
    为什么axios请求接口会发起两次请求
    axios基本用法
    webpack 配置文件
    IDEA系列(六)一This file is indented with tabs instead of 4 space
    IDEA系列(五)一控制台中文乱码
  • 原文地址:https://www.cnblogs.com/dys6/p/11303856.html
Copyright © 2020-2023  润新知