console . log ( 2 ) ;

异步函数如果使用 return 关键字返回了值(如果没有 return 则会返回 undefined ),这个值会被 Promise.resolve() 包装成一个 Promise 对象。

:异步函数始终返回 Promise 对象!!

async function foo() {
	console.log(1);
	return 3;
// 给返回的Promise添加一个解决处理程序
foo().then(console.log);
console.log(2);
//等同于
async function foo() {
	console.log(1);
	return Promise.resolve(3);
// 给返回的Promise添加一个解决处理程序
foo().then(console.log);
console.log(2);

await

async 函数返回一个 Promise 对象,可以使用 then 方法添加回调函数。当函数执行的时候,一旦遇到 await 就会先返回,等到异步操作完成,再接着执行函数体内后面的语句。

await关键字会暂停执行异步函数之后的代码,使其让出 JavaScript 运行时的执行线程,先执行异步。

  1. async 单独使用的时候,放在函数前面表示这个函数是一个异步函数,如果 async 函数有返回结果,必须要用.then()方法来承接(也就是返回的值会被自动处理成 promise 对象)

    async function helloAsync(){
        return "helloAsync";
    console.log(helloAsync())  // Promise {<resolved>: "helloAsync"}
    helloAsync().then(v=>{
       console.log(v);         // helloAsync
    
  2. async await 搭配使用的时候,await 是等待此函数执行后,再执行下一个,可以把异步函数变成同步来执行,控制函数的执行顺序。

    • await 后跟的函数是返回的 promise

      let foo = () => {
        return new Promise(resolve => {
          setTimeout(() => {
            console.log('lee');
            resolve();
          }, 1000);
        });
      async function bar() {
        await foo();		
        console.log('van');
      console.log(bar()); // 隔1秒同时输出 lee van
      
    • await 后跟的是普通函数(非 promise()

      let f1 = () => {
        setTimeout(() => {
          console.log('lee');
        }, 1000);
      let f2 = () => {
        setTimeout(() => {
          console.log('van');
        }, 1000);
      async function bar() {
        await f1();
        await f2();
        console.log('yeah');
      console.log(bar()); // yeah 隔1秒同时输出 lee fan
      
      • 如果它等到的是一个 Promise 对象,await 就忙起来了,它会阻塞后面的代码,等着 Promise 对象 resolve,然后得到 resolve 的值,作为 await 表达式的运算结果。
      • 如果它等到的不是一个 Promise 对象,那 await 表达式的运算结果就是它等到的东西;
      1. await 一定要搭配 async 使用,如果在 async function 函数体外使用 await ,你只会得到一个语法错误。
      1. await 关键字必须在异步函数中使用,不能在顶级上下文如<script>标签或模块中使用
      2. await 关键字也只能直接出现在异步函数的定义中,在同步函数内部使用 await 会抛出 SyntaxError
      3. await 不允许出现在箭头函数中
      4. 异步函数如果不包含 await 关键字,其执行基本上跟普通函数没有什么区别
      5. JavaScript 运行时在碰到 await 关键字时,会记录在哪里暂停执行。等到 await 右边的值可用了,JavaScript 运行时会向消息队列中推送一个任务,这个任务会恢复异步函数的执行

      实例分析await执行顺序:

      async function foo() {
      	console.log(2);
      	console.log(await Promise.resolve(8));
      	console.log(9);
      async function bar() {
       	console.log(4);
      	console.log(await 6);
      	console.log(7);
      console.log(1);
      foo();
      console.log(3);
      bar();
      console.log(5);  
      
      1. 打印 1;
      2. 调用异步函数 foo()
      3. (在 foo()中)打印 2;
      4. (在 foo()中)await 关键字暂停执行,向消息队列中添加一个 Promise在落定之后执行的任务;
      5. Promise立即落定,把给 await 提供值的任务添加到消息队列;
      6. foo()退出;
      7. 打印 3;
      8. 调用异步函数 bar()
      9. (在 bar()中)打印 4;
      10. (在 bar()中)await 关键字暂停执行,为立即可用的值 6 向消息队列中添加一个任务;
      11. bar()退出;
      12. 打印 5;
      13. 顶级线程执行完毕;
      14. JavaScript 运行时从消息队列中取出解决 await Promise的处理程序,并将解决的值 8 提供给它;
      15. JavaScript 运行时向消息队列中添加一个恢复执行 foo()函数的任务;
      16. JavaScript 运行时从消息队列中取出恢复执行 bar()的任务及值 6;
      17. (在 bar()中)恢复执行,await 取得值 6;
      18. (在 bar()中)打印 6;
      19. (在 bar()中)打印 7;
      20. bar()返回;
      21. 异步任务完成,JavaScript 从消息队列中取出恢复执行 foo()的任务及值 8;
      22. (在 foo()中)打印 8;
      23. (在 foo()中)打印 9;
      24. foo()返回。
      使用 关键字可以让函数具有异步特征,但总体上其代码仍然是同步求值的。异步函数如果使用 关键字返回了值(如果没有 则会返回 ),这个值会被 包装成一个对象。注:异步函数始终返回对象!!await 函数返回一个 对象,可以使用 方法添加回调函数。当函数执行的时候,一旦遇到 就会先返回,等到异步操作完成,再接着执行函数体内后面的语句。关键字会暂停执行异步函数之后的代码,使其让出 运行时的执行线程,先执行异步。单独使用的时候,放在函数前面表示这个函数是一个异步函数,如果 函数有返回结果,必须要用方法来承接(也
      在之前的C#基础知识系列文章中只介绍了从C#1.0到C#4.0中主要的特性,然而.NET4.5的推出,对于C#又有了新特性的增加——就是C#5.0中async和await两个关键字,这两个关键字简化了异步编程,之所以简化了,还是因为编译器给我们做了更多的工作,下面就具体看看编译器到底在背后帮我们做了哪些复杂的工作的。对于同步的代码,大家肯定都不陌生,因为我们平常写的代码大部分都是同步的,然而同步代码却存在一个很严重的问题,例如我们向一个Web服务器发出一个请求时,如果我们发出请求的代码是同步实现的话,这时候我们的应用程序就会处于等待状态,直到收回一个响应信息为止,然而在这个等待的状态,对于用户
      本文介绍了三分钟学会用ES7中的Async/Await进行异步编程,分享给大家,具体如下: Async/Await基本规则 async 表示这是一个async函数,await只能用在这个函数里面。 await 表示在这里等待promise返回结果了,再继续执行。 await 后面跟着的应该是一个promise对象(当然,其他返回值也没关系,只是会立即执行,不过那样就没有意义了…) 一个Async/Await例子 Async/Await应该是目前最简单的异步方案了,首先来看个例子。 这里我们要实现一个暂停功能,输入N毫秒,则停顿N毫秒后才继续往下执行。 var sleep = f
      js任务队列链接 js是一直在轮训一个主任务队列其他任务做完之后js再去任务队列里面轮训,有的话就执行 Promise 是异步编程的一种解决方案:从语法上讲,promise是一个对象,从它可以获取异步操作的消息;从本意上讲,它是承诺,承诺它过一段时间会给你一个结果。promise有三种状态:pending(等待态),fulfiled(成功态),rejected(失败态);状态一旦改变,就不会再变。创造promise实例后,它会立即执行。 promise个状态方法里面的任务是微任务 主线程里面的动作是宏任务,只有等宏任务里面的代码都执行完了,轮训的时候才能拿到微任务, 所以这段代码的输出才是先
      当 “module“ 选项设置为 “esnext“ 或 “system“,并且 “target“ 选项设置为 “es2017“ 或更高版本时,才允许使用顶级 “await表达式。ts(1378)
      当 “module” 选项设置为 “esnext” 或 “system”,并且 “target” 选项设置为 “es2017” 或更高版本时,才允许使用顶级 “await表达式。ts(1378) "compileOnSave": true, "compilerOptions": { "moduleResolution": "node", "alwaysStrict": true, "charset": "utf8", "declaration": false
      使用 async/await 是一种以更简洁和易读的方式处理异步编程的方法。以下是 async/await 的几个优势: 1. 简洁性:async/await异步代码看起来更像是同步代码,避免了回调地狱和复杂的 Promise 链式调用。它使用类似于同步编程的语法,使代码更易于理解和维护。 2. 错误处理:使用 try/catch 块可以轻松地捕获和处理异步操作中的错误。相比于传统的回调函数或 Promise 链,错误处理更加直观和简单。 3. 可读性:async/await 代码的可读性更高,因为它允许开发者按照自然的顺序编写代码,而不需要理会回调函数的执行顺序。 4. 异常传播:在 async/await 中,异常会自动传播到调用链的最上层,使得错误处理更加方便。在 Promise 链中,必须手动传播异常。 5. 调试友好:使用 async/await 进行异步编程时,调试器可以更方便地追踪代码执行流程,使得调试过程更加简单。 总之,async/await 提供了一种更加直观和优雅的方式来处理异步操作,使得代码更易读、易写和易于维护。