本周日内容是:宏任务和微任务的总结(js队列执行顺序)+ 一点琐事(善待自己)

前言

之后每次文章都计划是 一点知识点 +生活中一点琐事(我也想做个技术博主,但是能力不足,只能再添加一些生活琐事了)。再次提前声明,如果文章有技术性错误、错别字、或者语义错误的句子,希望您提一下,非常感谢。

js执行队列

宏任务

宏任务:进入一个js文件,js文件中所有的代码就可以看作为宏任务,宏任务是一个执行队列,它中间还可以再包括宏任务和微任务,但是在执行时候,会“挂起”一些后执行的宏任务和微任务。
包括:刚刚进入js文件中的所有js代码、setTimeout、setInterval、XHR回调、鼠标键盘事件等

微任务

微任务:在执行队列中,某队列的宏任务执行完成后,才会执行此队列被挂起的微任务,微任务中也可以包含宏任务和微任务。
包括:Promise.then()函数、process.nextTick函数等。

栗子

console.log("游戏开始",1);
new Promise( (resolve) => {console.log("promise",2);resolve();
})
.then( () => {console.log("then",3);
});
console.log("promise结束",4);
setTimeout( () => {console.log("setTimeout",5);new Promise( (resolve) => {console.log("promise",6);resolve();}).then( () => {console.log("then",7);});
},0);
new Promise( (resolve) => {console.log(promise,8);resolve()
})
.then( () => {console.log(then,9)setTimeout( () => {console.log("setTimeout",10);},0);
})
console.log("游戏结束",11);

好像稍微有点繁琐哈。最好是拿张纸,直接在纸上面进行一个排序和输出(大佬除外)。
牢记代码执行顺序:整体代码(宏任务) -> 整体代码中挂起的微任务 -> 整体代码中挂起的宏任务
代码开始:

第一个宏任务执行:

1、执行第一个宏任务(所有代码)

2、执行第一个console打印:游戏开始,1

3、遇见Promise,执行promise中内容,打印:promise,2 。遇见resolve(),那么则把then函数放在 微任务队列

4、继续执行代码,打印:promise结束,4

5、遇见setTimeout函数,将此函数放在 宏任务队列

6、遇见Promise函数,打印:promise,8。遇见resolve(),那么则把then函数放在 微任务队列

7、继续执行代码,打印:游戏结束,11

8、第一次宏任务队列执行完成

第一个微任务执行:

1、执行上图中微任务队列中的第一个,打印:then,3

2、执行上图中微任务队列中的第二个,打印:then,9。然后将setTimeout放在另外一个宏任务队列中(在下次宏任务和微任务结束后执行次宏任务)

3、第一次微任务队列执行完成

第二个宏任务开始执行

1、执行setTimeout,打印:setTimeout,5

2、执行setTimeout中的 Promise, 打印:promise,6。遇见resolve,将then放入微任务

注意:此时的微任务是setTimeou宏任务中的微任务,故其执行顺序应该在此次完成宏任务之后

3、宏任务执行完成

第二个微任务开始执行

1、执行then函数,打印:then,7

2、第二个微任务执行完成

第三个宏任务开始执行

1、执行setTimeout,打印:setTimeout,10

2、第三个宏任务执行完成

总结:从上而下的队列执行后的打印结果为:

游戏开始,1
promise,2
promise结束,4
promise,8
游戏结束,11
then,3
then,9
setTimeout,5
promise,6
then,7
setTimeout,10

易错点:在第二个宏任务执行中,容易先执行之后的宏任务而导致错误,所以,牢记,每个宏任务执行完成后,一定要限制性其队列中挂起的微任务后,再执行下一个宏任务。

代码部分结束。

一点琐事

昨天,我的一个小伙伴拿到了 阿里巴巴offer + 美团点评offer + 字节跳动offer + 快手offer,其中 网易 的offer好像正在流程。最最关键的是人还漂亮,她老公也还不错,家里两只狗子又憨又可爱…………

再说下去不能活了,我现在就是柠檬精附体,酸的不行不行的了。

大概介绍下吧,她研究生实习和我在一个单位呆过一段时间,然后我换了公司和她联系就很少,只知道她去了另外一公司实习,忘记是阿里还是美团了。

每天能看见她的朋友圈,基本是晒美食+老公,或者是旅游+遛狗+老公,再或者是加班+公司(环境高大上)+不好打车+老公(开车接她)。完全就是90%的人的梦想生活。

但是,也是很平常的生活,最起码我相信她是这么认为的。

说一下我对她的印象吧:温柔、平淡中带着一丝奢华(闪瞎我眼睛的钻戒)、素面朝天(或许应该是天生丽质)、普通;就是一个刚刚毕业的小女孩,没心机,不伪装。嗯,大概就这些吧。(这么简洁,如果你那天看见了,请不要拿榴莲砸我,/狗头保命)

学到的一些东西:

**生活本来就是很简单的一件事情,贫困或者富有,都有自己的一种生活方式。
富有时,不奢侈,不夸张(富有生活经验较少,所以别见怪);
贫困时:我也经历了几年上学时吃不饱没朋友的生活,所以我应该有发言权,从小很少有人和我一起玩,因为我比较孤僻,也时常沉浸在自己的世界里面,渴望更害怕别人进来,更不用说从自己世界出去。这造就了我不合群,也造就了我高中之前几乎没朋友的现状。 **

但是我仍旧感激自己,感激自己 ,没有因为要交朋友,就让自己低人一等,或者让自己刻意讨好他人。这也是我至今在社会上三四年了,仍旧不会做所谓的社会事。

说这些不是卖惨,也不想劝诫所有人要挺直腰板,战斗到底。每个人岗位不一样,做的事情,做事情方式自然不一样。没什么对错,只是为了吃饭而已。

我真正想表达的是,善待自己,善待自己周围的人,善待心里的那个’你’。善待坚持到底,半夜加班,凌晨两点还走在出租房路上,一个人乘坐电梯,或者接起电话会不自觉弯下脊梁的你。

最后,祝那位漂亮的小富婆同学,在你的新公司,好好努力,实在不行就回家继承家产吧。(/狗头再次保命)

完事。。。

雾凇沆砀,天与云与山与水,上下一白,湖上影子,惟长堤一痕、湖心亭一点、与余舟一芥、舟中人两三粒而已
————《湖心亭看雪》

宏任务和微任务的总结(js队列执行顺序)+ 一点琐事(善待自己)相关推荐

  1. js回调执行顺序,同步任务与异步任务,宏任务与微任务

    JS执行顺序 JS是单线程的,即一段时间只能执行一个任务.执行一段代码,js总是按照顺序执行的,只不过在执行的过程中不会等待异步任务. 同步任务与异步任务 同步任务:立即执行的任务,直接被主线程读取并 ...

  2. ❤️一起谈一谈js中的宏任务和微任务!

    前面面试的文章中我们说过一道关于宏任务和微任务的题: setTimeout(function(){console.log('1') });new Promise(function(resolve){c ...

  3. JS基础知识三:宏任务和微任务

    宏任务和微任务 一.宏队列,macrotask,也叫tasks. 一些异步任务的回调会依次进入macro task queue,等待后续被调用 setTimeout setInterval setIm ...

  4. 弄懂 JavaScript 执行机制,宏任务和微任务

    本文的目的就是要保证你彻底弄懂javascript的执行机制. 不论你是javascript新手还是老鸟,不论是面试求职,还是日常开发工作,我们经常会遇到这样的情况:给定的几行代码,我们需要知道其输出 ...

  5. 阿里一面:熟悉事件循环?那谈谈为什么会分为宏任务和微任务。

    什么是事件循环 在了解事件循环前,需要一些有关JS特性的前置知识. JS引擎是单线程的,直白来说就是一个时间点下JS引擎只能去做一件事情,而Java这种多线程语言,可以同时做几件事情. JS做的任务分 ...

  6. 宏事件、微事件、 JavaScript 执行机制

    案例预热: setTimeout(function(){console.log('定时器开始啦')});new Promise(function(resolve){console.log('马上执行f ...

  7. ajax是宏任务还是微任务,JavaScript的宏任务和微任务

    1. JavaScript是单线程语言 JavaScript是一门单线程语言,在最新的html5中提出了web-worker,但是JavaScript是单线程的核心并没有改变. 所有关于JavaScr ...

  8. js---对事件循环宏任务和微任务的理解

    一.JS特点 Js作为一门单线程语言,即一次只能完成一个任务,当有多个任务时,任务就得进行排队等待执行,只能等待自己的前一个任务执行完成后自己才能执行. 二.JS事件循环 要理解JS的事件循环的就必须 ...

  9. js 异步执行_js执行过程你了解多少?

    来公众号:「九零后重庆崽儿」找我,一起学前端. 本文首发在: js执行过程你了解多少? - 重庆崽儿brand的个人主页​www.brandhuang.com 文章自己整理自网络,如有问题欢迎在知乎或 ...

最新文章

  1. 2020年AI产业报告:100个岗位抢1个人,计算机视觉成最大缺口
  2. 干货 | 目标检测入门,看这篇就够了(上)
  3. iOS原生定位和反编码
  4. c语言字符串转64位哈希值,对字符串进行hash处理用什么方法好???
  5. 一篇深入剖析PCA的好文
  6. python supervisor_python之supervisor进程管理工具
  7. nodejs返回html与vue,vuejs和nodejs的区别是什么?
  8. WebLogic的下载与安装(图文教程)
  9. 关于Servlet报错:405 HTTP method GET is not supported by this URL问题解决方法
  10. IntelliJ idea 添加参数
  11. javascript闭包(Module模式)的用途和高级使用方式
  12. python简单查询用户
  13. atat 编译安装测试说明
  14. html实战解析—折扣计算器生成机制及实例代码
  15. 如何用photoshop切图并去掉图片上面的文字
  16. vue实现登录路由跳转到成功页面
  17. 用python证明角谷猜想_关于角谷猜想的证明
  18. 在MATLAB中如何读取心音信号,基于Matlab的心音信号分析比较研究_问答库
  19. Veeam Backup Replication 12 配置信息备份
  20. 华为防火墙-4-安全策略

热门文章

  1. iOS全局关闭黑暗模式、解决状态栏显示问题
  2. cmd命令行返回上一级目录、切换到其他的盘、看一下该目录都有什么文件、打开该目录的某文件、改变命令颜色、快速进入某文件目录的方法
  3. cpu锁频导致插上电源卡顿
  4. 微信新版本8.0.19新增的三个贴心实用功能您使用了吗?
  5. 安装完python后,提示api-ms-win-crt-runtime-l1-1-0.dll 丢失的问题解决
  6. win7鼠标突然不动了怎么办?排查鼠标失灵的方法
  7. 点击高级系统设置无反应
  8. js函数判断字符串的长度
  9. SSL证书下载失败如何解决
  10. 【JavaSE】知识点总结:封装