`
itace
  • 浏览: 180853 次
  • 性别: Icon_minigender_1
  • 来自: 北京
文章分类
社区版块
存档分类
最新评论

js中async,await,setTimeout,promise执行顺序

 
阅读更多

:标注执行顺序

       async function async1() {

            console.log('async1 start');//2

            await async2();

            console.log('async1 end');//7

        }


        async function  async2() {

            console.log('async2');//3

        }

        console.log('script start');//1


        setTimeout(function () {

                console.log('setTimeout');//8

            },0);

        async1();


        new  Promise  (
            function  (resolve) {

                console.log( 'promise1' );//4

                resolve();

            }).then(function () {
                console.log('promise2');//6
            });


        console.log( 'script end' );//5

 

 分析一下 await async2()

await,它先计算出右侧的结果,然后看到await后,中断async函数:

  • 先得到await右侧表达式的结果。执行 async2(),打印同步代码 console.log('async2'),并且return Promise.resolve(undefined)

  • await后,中断async函数,先执行async外的同步代码。

目前就直接打印 console.log('async2')

被阻塞后,要执行async之外的代码。

分享到:
评论

相关推荐

    vue3 使用async await

    在这个例子中,`someAsyncFunction`是一个异步函数,`await`关键字会暂停执行,直到`somePromise`返回的Promise被解析或拒绝。一旦Promise完成,`await`表达式的结果就是Promise的结果(无论是`resolve`的值还是`...

    js代码-promise, setTimeout, async, await 输出顺序题

    当Promise、setTimeout和async/await一起使用时,它们的执行顺序可能并不直观,因为JavaScript引擎遵循事件循环(Event Loop)和任务队列(Task Queue)的机制。大致来说,同步代码先执行,然后是微任务(Microtask...

    【JavaScript源代码】JavaScript中async,await的使用和方法.docx

    在JavaScript中,`async`和`await`是ES2017引入的两个关键特性,它们主要用于处理异步操作,让代码看起来更简洁、可读性更强。它们是现代JavaScript异步编程的重要工具,尤其在处理Promise链时,能够极大地提高代码...

    js代码-2、JS代码的执行顺序:async、promise、setTimeout

    JavaScript是Web开发中的核心语言,它的...这就是JavaScript中异步执行的基本原理,以及`async`、`Promise`和`setTimeout`如何影响代码执行顺序。在实际开发中,理解这些概念对于写出高效且易于维护的代码至关重要。

    js代码-async await promise

    `Promise`是JavaScript中的一个对象,用于表示一个可能已经完成或尚未完成的异步操作的结果。它有三种状态:pending(等待中)、fulfilled(已成功)和rejected(已失败)。一旦状态改变,就不会再次改变,可以通过`...

    async/await让异步操作同步执行的方法详解

    在JavaScript中,异步编程是处理I/O操作、网络请求和计算密集型任务的关键技术,因为这些操作不能阻塞主线程。传统的异步处理方式包括回调函数和Promise,但它们都存在一定的复杂性和易出错性。随着ES6的发布,`...

    小程序开发中如何使用async-await并封装公共异步请求的方法

    前言 在平常的项目开发中肯定会遇到同步异步执行的问题...3.当然es6中的promise倒是很好的解决了这样的问题,再配合es7的async和await就更完美了,await返回的也是一个promise对象,这个关于promise和async,await的使

    js代码-事件循环判断输出,重点async await promise

    总的来说,`async/await` 和 `Promise` 提供了一种更优雅的方式来处理异步操作,而事件循环则是JavaScript中实现并发的关键机制。了解这些概念对于编写高效、可维护的JavaScript代码至关重要。在实际项目中,通过...

    JavaScript中的async/await

    【JavaScript中的async/await】 1. async/await的定义与作用 async是一个函数修饰符,用来标记一个函数为异步函数。这样的函数会默认返回一个Promise对象,且这个Promise对象的状态由函数内的业务逻辑决定。当async...

    async / await 解决回调地狱

    在JavaScript中,`async`关键字用于声明一个异步函数。这个函数内部可以使用`await`关键字,使得异步操作变得同步化。例如: ```javascript async function goHome() { let result = await new Promise(function...

    js代码-await 执行顺序

    在JavaScript中,`await`关键字是异步编程的重要组成部分,特别是在使用async/await语法时。这个语法模式使得处理异步操作更加简洁,看起来就像是同步代码一样。`await`关键字用于等待一个Promise对象完成,然后返回...

    JS中async/await实现异步调用的方法

    在JavaScript中,异步编程是处理I/O操作、网络请求等耗时任务的关键技术。async/await 是ES2017引入的一种更简洁、更易读的处理异步操作的方式,它让异步代码看起来更接近同步代码,提高了代码的可读性和可维护性。 ...

    围绕setTimeout的一个微型28字节Promise封装

    这使得异步代码更易于理解和维护,特别是在处理多个异步操作时,可以利用Promise的`.then`链式调用来按顺序执行任务。 不过,需要注意的是,虽然这个微型Promise封装在某些情况下非常实用,但它并不包含错误处理...

    awaitsignal一个简单的基于promise的信号系统用于运行异步任务

    在JavaScript开发中,异步编程是必不可少的一部分,它允许我们执行耗时操作,如网络请求或文件读写,而不阻塞程序的主线程。"awaitsignal" 是一个基于Promise的信号系统,专为管理这样的异步任务而设计。这个库提供...

    详解Node.js中的Async和Await函数

    在串行执行多个异步操作时,async/await模式特别有用,因为你可以以一种直观的方式按照代码顺序执行它们,而不必关心Promise的链式调用。例如: ```javascript async function serialExecution() { let result1 = ...

    async/await优雅的错误处理方法总结

    在Node.js的世界中,异步编程是一个基础且关键的部分。传统的回调函数(callback)虽然可以处理异步,但随着代码复杂性的增加,它们会变得难以维护和理解。为了解决这个问题,ES2017引入了async/await语法,它允许...

    js代码-Promise & async/await

    JavaScript中的Promise和async/await是现代JavaScript异步编程的核心机制,它们使得处理复杂的异步流程变得更为简洁和易读。Promise是ES6引入的一种解决回调地狱问题的方式,而async/await则是ES7(准确地说是ES2017...

Global site tag (gtag.js) - Google Analytics