await 与其他普通代码的执行顺序

本是古典何须时尚 2024-03-24 20:21 5阅读 0赞

在讨论await与其他普通代码的执行顺序时，我们通常指的是在异步编程中，特别是在使用异步/await语法进行JavaScript编程时的情况。异步编程允许程序在等待某些异步操作完成的同时继续执行其他任务，而不会阻塞整个程序的执行。

以下是关于await与其他普通代码执行顺序的一些基本概念：

1.异步函数与await： await关键字只能在异步函数中使用。异步函数是使用async关键字声明的函数。当在异步函数中使用await关键字时，它会等待一个返回Promise对象的异步操作完成，并且暂停函数的执行，直到该Promise对象解析（或拒绝）为止。在等待的过程中，其他代码可以继续执行。

2.非阻塞执行： await关键字的存在使得代码可以以非阻塞方式执行。这意味着当遇到await时，JavaScript引擎可以暂停当前函数的执行，并在等待的同时执行其他可以执行的任务，从而提高程序的并发性和响应性。

3.顺序执行： 尽管await可以让异步操作看起来像同步操作一样，但在异步函数内部，await之前的代码会按照顺序执行，而await之后的代码会在等待的异步操作完成后才会继续执行。

4.事件循环： JavaScript使用事件循环来管理异步操作的执行。事件循环是一种机制，用于调度和执行各种任务，包括定时器、异步函数以及其他事件。await的存在允许事件循环在等待异步操作完成时继续处理其他任务。

下面是一个简单的例子来说明await与其他普通代码的执行顺序：

async function fetchData() \{

console.log("Start fetching data");

const response = await fetch("https://api.example.com/data");

const data = await response.json();

console.log("Data fetched:", data);

\}

console.log("Before fetchData");

fetchData();

console.log("After fetchData");

在上述代码中，执行顺序大致如下：

打印 "Before fetchData"。

调用 fetchData() 异步函数，开始执行。

打印 "Start fetching data"。

遇到第一个 await，暂停 fetchData 函数执行，但事件循环继续执行其他任务。

打印 "After fetchData"。

异步操作完成后，事件循环将 fetchData 恢复执行。

打印 "Data fetched: ..."，输出获取到的数据。

这个例子展示了await如何使异步操作的执行在其他代码执行之间进行交错，从而实现非阻塞的异步编程。

发表评论取消回复

表情：

评论列表（有 0 条评论，5人围观）

还没有评论，来说两句吧...

相关阅读

相关 Js中async/await的执行顺序详解

// 异步函数 async function asyncFn() { // do something let foo = ...

喜欢ヅ旅行/ 2024年04月19日 15:20/ 0 赞/ 61 阅读

相关 Transactional和普通自定义切面执行顺序的思考

前言因为之前读过spring transaction相关源码《Transaction Management源码阅读路径》，所以对@[Transactional][]和普

不念不忘少年蓝@/ 2024年03月25日 14:14/ 0 赞/ 10 阅读

相关 await 与其他普通代码的执行顺序

在讨论await与其他普通代码的执行顺序时，我们通常指的是在异步编程中，特别是在使用异步/await语法进行JavaScript编程时的情况。异步编程允许程序在等待某些异步操作

本是古典何须时尚/ 2024年03月24日 20:21/ 0 赞/ 6 阅读

相关 static中代码执行顺序

废话不说直接上图： ![9a232718285b4028a22c3a327e6c4d5b.png][] [9a232718285b4028a22c3a327e6c4

喜欢ヅ旅行/ 2024年03月24日 16:45/ 0 赞/ 68 阅读

相关 Java类的初始化顺序(静态变量、普通成员变量、静态代码块、构造方法的执行顺序)；static静态代码块执行时机

父类静态成员变量 -> 本类静态变量 -> 父类非静态变量 -> 父类构造函数 -> 本类非静态变量 ->本类构造函数 public class Main {

Myth丶恋晨/ 2023年09月30日 23:04/ 0 赞/ 25 阅读

相关 Promise async await 宏任务微任务执行顺序

执行顺序：![在这里插入图片描述][watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA5YmN56u

末蓝、/ 2022年09月14日 15:17/ 0 赞/ 245 阅读

相关静态代码块执行顺序

package com.test; public class B \{ public static B t1 = new B(); p

短命女/ 2022年06月14日 04:07/ 0 赞/ 245 阅读

相关 vue方法同步（顺序）执行：async/await使用

项目中有一个地方需要获取到接口返回值之后根据返回值确定之后执行的步骤，使用async搭配await实现，await函数不能单独使用。方法如下: async metho

小咪咪/ 2022年02月01日 04:51/ 0 赞/ 562 阅读

相关 promise、async/await在任务队列中的执行顺序

我们这篇主要讲浏览器和Nodejs环境下任务队列的执行顺序，尤其关注promise和async/await在任务队列中的执行顺序。 1.setTimeout、setImmed

r囧r小猫/ 2021年10月24日 02:32/ 0 赞/ 519 阅读

相关 promise、async、await、settimeout异步原理与执行顺序

一道经典的前端笔试题，你能一眼写出他们的执行结果吗？ async function async1() { console.log("

柔情只为你懂/ 2021年08月28日 15:57/ 0 赞/ 526 阅读