• promise.then VS setTimeout

  在chrome和node环境环境中均输出2, 3, 1, 先输出2没什么好说的,3和1顺序让人有些意外

原因

有一个事件循环,但是任务队列可以有多个。

整个script代码,放在了macrotask queue中,setTimeout也放入macrotask queue。

但是,promise.then放到了另一个任务队列microtask queue中。

这两个任务队列执行顺序如下,取1个macrotask queue中的task,执行之。

然后把所有microtask queue顺序执行完,再取macrotask queue中的下一个任务。

代码开始执行时,所有这些代码在macrotask queue中,取出来执行之。

后面遇到了setTimeout,又加入到macrotask queue中,

然后,遇到了promise.then,放入到了另一个队列microtask queue。

等整个execution context stack执行完后,

下一步该取的是microtask queue中的任务了。

因此promise.then的回调比setTimeout先执行。

  • await
async function a() {
await console.log(1)
console.log(2)
} async function b() {
await a();
} b(); console.log(3)

输出: 1, 3, 2

async function a() {
await console.log(1)
console.log(2)
} async function b() {
await a();
} b(); setTimeont(function(){console.log(3)},0)

输出: 1,  2, 3

await不会造成程序阻塞,只是promise的语法糖,可以看看babel编译后async/await, 可以这么理解,async 是多个异步操作的promise对象,await相当于then,代码执行跟你用callback写的代码并没有什么区别,本质上并不是同步代码,只是让你思考代码逻辑的时候能够以同步的思维去思考,避开回调地狱,要理解异步,首先要理解cpu的工作方式,cpu执行代码的时候,一个周期是以时间片为单位,实际上,无论是php还是node,处理同一个请求,cpu需要的计算量是一样的,在同样的时间内,cpu能做的计算量是一样的,差别在于,node只是提高了cpu的利用率。从而提高了同一时间能处理的请求数量。

 
打个比方,你去银行办理业务,只有一个窗口在办理业务(一个cpu进程),假设有两个人(A和B)要办理银行卡(可理解为一次请求),方式一:A到窗口前,但这个时候要办卡的话,柜员告诉你,要你的身份证复印件(可理解为IO操作),这个时候,你去复印,柜员等待,回来后继续办理,A办理完成后,B接着同样的步骤。方式二:在A去复印身份证的时候,柜员受理B的办理请求, 等A回来后再受理A的业务。所以,很明显,方式二在同样多的时间内,一个窗口能办理的银行卡数量更多,因为这种方式充分利用了柜员等待的时间,那么方式一就是php处理请求的方式,在PHP中,处理IO操作的时候(比如,访问数据库,读取文件等),实际上cpu是处于等待状态,但其他资源此时得不到cpu的计算资源,属于资源浪费,cpu并没有接受下一个请求,而方式二,则是node处理的方式。所以综上所述,async/await 并不会影响node的并发数量,async/await是以同步的思维去写异步的代码。

promise.then, setTimeout,await执行顺序问题的更多相关文章

  1. setTimeout,promise,promise.then, async,await执行顺序问题

    今天下午看了好多关于这些执行顺序的问题  经过自己的实践 终于理解了  记录一下就拿网上出现频繁的代码来说: async function async1() { console.log('async1 ...

  2. process.nextTick,Promise.then,setTimeout,setImmediate执行顺序

    1. 同步代码执行顺序优先级高于异步代码执行顺序优先级: 2. new Promise(fn)中的fn是同步执行: 3. process.nextTick()>Promise.then()> ...

  3. async/await 执行顺序详解

    随着async/await正式纳入ES7标准,越来越多的人开始研究据说是异步编程终级解决方案的 async/await.但是很多人对这个方法中内部怎么执行的还不是很了解,本文是我看了一遍技术博客理解 ...

  4. 错误的理解引起的bug async await 执行顺序

    今天有幸好碰到一个bug,让我知道了之前我对await async 的理解有点偏差. 错误的理解 之前我一直以为  await 后面的表达式,如果是直接返回一个具体的值就不会等待,而是继续执行asyn ...

  5. async和await执行顺序

    关于执行顺序和线程ID,写了一个小程序来检测学习: using System; using System.Net; using System.Threading; using System.Threa ...

  6. for循环中嵌套setTimeout,执行顺序和结果该如何理解?

    这两天在捣鼓作用域的问题,有的时候知识这个东西真的有点像是牵一发而动全身的感觉.在理解作用域的时候,又看到了一道经典的面试题和例子题. 那就是在for循环中嵌套setTimeout延时,想想之前面试的 ...

  7. 事件循环 EventLoop(Promise,setTimeOut,async/await执行顺序)

    什么是事件循环?想要了解什么是事件循环就要从js的工作原理开始说起: JS主要的特点就是单线程,所谓单线程就是进程中只有一个线程在运行. 为什么JS是单线程的而不是多线程的呢? JS的主要用途就是与用 ...

  8. Promise嵌套问题/async await执行顺序

    /* 原则: 执行完当前promise, 会把紧挨着的then放入microtask队尾, 链后面的第二个then暂不处理分析, */ 一. new Promise((resolve, reject) ...

  9. Promise.then方法的执行顺序例题分析

    1. 当Promise对象作为resolve的参数时 const p = Promise.resolve(); const p1 = Promise.resolve(p); //就是p const p ...

随机推荐

  1. CentOS7.5 安装MySQL8 tar

    1.查看是否安装mariadb 执行命令: [root@mysql ~]# rpm -qa | grep mariadb 显示: mariadb-libs-5.5.56-2.el7.x86_64 2. ...

  2. VS Code直接编辑下一行

    ctrl + enter 可以直接跳转到下一行进行编辑,本行后面的字符不受影响. 这在书写html脚本时非常有用.

  3. 【C++】如何接收函数return返回来的数组元素

    转自 https://www.cnblogs.com/Wade-James/p/7965775.html 我们知道return语句作为被调用函数的结束,返回给调用者函数值.一般来说,是返回一个函数值, ...

  4. [蓝桥杯]PREV-23.历届试题_数字游戏

    问题描述 栋栋正在和同学们玩一个数字游戏. 游戏的规则是这样的:栋栋和同学们一共n个人围坐在一圈.栋栋首先说出数字1.接下来,坐在栋栋左手边的同学要说下一个数字2.再下面的一个同学要从上一个同学说的数 ...

  5. SpringBoot与SpringCloud的版本对应详细版

    大版本对应: Spring Boot Spring Cloud 1.2.x Angel版本 1.3.x Brixton版本 1.4.x stripes Camden版本 1.5.x Dalston版本 ...

  6. python之路——25

    复习 1.继承 表示什么是什么的关系 1.单继承 1.先抽象,再继承 2.子类没有的名字,调用父类 3.类中使用self,看清楚self指向谁 2.多继承 1.新式类和经典类 1.新式类:广度优先 经 ...

  7. TNS-12541: TNS: 无监听程序 解决方案

    转自   感谢   https://www.cnblogs.com/yx007/p/6732012.html 问题描述 在用PL/SQL Developer连接Oracle 11g时报错“ORA-12 ...

  8. TensorFlow实现回归

    数据:fetch_california_housing(加利福尼亚的房价数据) 1.解析解法 import tensorflow as tf import numpy as np from sklea ...

  9. Jenkins服务使用nginx代理服务器做负载均衡

    学习nginx代理服务器做负载均衡的使用 在本地安装Nginx 1.下载nginx http://nginx.org/en/download.html         下载稳定版本,以nginx/Wi ...

  10. axure8.0激活

    Licensee:米 业成 (STUDENT)Key:nFmqBBvEqdvbiUjy8NZiyWiRSg3yO+PtZ8c9wdwxWse4WprphvSu9sohAdpNnJK5