目录
异步函数的执行
定义函数
调用函数
Promise.all()
特性
结语
首页 web前端 js教程 使用 Promise.all()

使用 Promise.all()

Jan 21, 2025 am 12:30 AM

Memanfaatkan Promise.all()

使用一次 await 等待多个异步进程。

JavaScript 的一个强大之处在于它能够进行异步 (asynchronous) 操作,避免进程间的相互等待。在实际应用中,异步操作常用于等待时间取决于外部因素的进程,例如网络连接、存储速度等。以下是一些异步操作的例子:

  • 数据库查询
  • 从其他网站获取数据 (HTTP 请求)
  • 读写文件
  • 发送邮件

异步函数的执行

在 JavaScript 中,异步操作通常使用函数来实现。函数是一组执行特定任务的代码块,例如加法函数用于计算和,关机函数用于关闭计算机(也许有这样的函数 ?)。

定义函数

定义异步函数只需在函数声明时添加 async 关键字,其余与普通函数相同。

例如,我们定义一个异步发送邮件的函数:

async function kirimEmail(tujuan, judul, isi) {
  // 发送邮件
  // ...
}
登录后复制

或者使用箭头函数:

const kirimEmail = async (tujuan, judul, isi) => {
  // 发送邮件
  // ...
}
登录后复制

调用函数

调用上述函数时,它会自动异步执行,这意味着不会互相等待。

例如:

kirimEmail('contoh1@email.com', 'Tes 1 Email', 'Halo. Ini saya lagi ngetes.');
kirimEmail('contoh2@email.com', 'Tes 2 Email', 'Halo. Ini saya lagi ngetes.');
kirimEmail('contoh3@email.com', 'Tes 3 Email', 'Halo. Ini saya lagi ngetes.');
登录后复制

在上述示例中,所有发送邮件的进程都是按顺序执行的,但不会等待任何一个进程完成。因此,下一个进程会在前一个进程未完成时启动,不会互相阻塞。

如果需要获取数据或等待异步进程完成,可以在调用函数时使用 await 关键字。

例如:

await kirimEmail('contoh1@email.com', 'Tes 1 Email', 'Halo. Ini saya lagi ngetes.');
await kirimEmail('contoh2@email.com', 'Tes 2 Email', 'Halo. Ini saya lagi ngetes.');
await kirimEmail('contoh3@email.com', 'Tes 3 Email', 'Halo. Ini saya lagi ngetes.');
登录后复制

在这个例子中,每个进程都会等待前一个进程完成。这种情况通常发生在需要从一个进程获取数据用于下一个进程的情况下,因此必须等待前一个进程完成才能获取所需数据。

Promise.all()

使用 Promise.all,我们可以同时调用和等待多个异步函数。

调用函数

使用 Promise.all 调用多个异步函数的示例如下:

await Promise.all([
  kirimEmail('contoh1@email.com', 'Tes 1 Email', 'Halo. Ini saya lagi ngetes.'),
  kirimEmail('contoh2@email.com', 'Tes 2 Email', 'Halo. Ini saya lagi ngetes.'),
  kirimEmail('contoh3@email.com', 'Tes 3 Email', 'Halo. Ini saya lagi ngetes.'),
]);
登录后复制

在上述示例中,我们等待三个发送邮件进程的完成,无论成功或失败,结果都将以数组的形式返回。

特性

Promise.all 的特性如下:

  • 要执行的异步函数放在一个数组中;
  • 所有函数作为一个整体执行,从启动到完成;
  • 由于它们作为一个整体,所有进程都将等待直到完成,尤其是在使用 await 的情况下;
  • 如果其中一个进程发生错误,则所有进程都将报错。

更多详细信息请参考 MDN 的 Promise.all 文档。

结语

使用 Promise.all 非常方便,我们只需要写一次 await ?,并且如果我们希望在其中一个进程出错时停止所有进程,它也很有用。但是,如果我们希望即使某个进程出错也能继续执行其他进程,我们将在下一篇文章中讨论。

感谢您的阅读。如果您想讨论,请留言。如果您想交朋友,请告诉我 ?

以上是使用 Promise.all()的详细内容。更多信息请关注PHP中文网其他相关文章!

本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热门文章

仓库:如何复兴队友
3 周前 By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island冒险:如何获得巨型种子
3 周前 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.能量晶体解释及其做什么(黄色晶体)
1 周前 By 尊渡假赌尊渡假赌尊渡假赌

热门文章

仓库:如何复兴队友
3 周前 By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island冒险:如何获得巨型种子
3 周前 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.能量晶体解释及其做什么(黄色晶体)
1 周前 By 尊渡假赌尊渡假赌尊渡假赌

热门文章标签

记事本++7.3.1

记事本++7.3.1

好用且免费的代码编辑器

SublimeText3汉化版

SublimeText3汉化版

中文版,非常好用

禅工作室 13.0.1

禅工作室 13.0.1

功能强大的PHP集成开发环境

Dreamweaver CS6

Dreamweaver CS6

视觉化网页开发工具

SublimeText3 Mac版

SublimeText3 Mac版

神级代码编辑软件(SublimeText3)

在JavaScript中替换字符串字符 在JavaScript中替换字符串字符 Mar 11, 2025 am 12:07 AM

在JavaScript中替换字符串字符

自定义Google搜索API设置教程 自定义Google搜索API设置教程 Mar 04, 2025 am 01:06 AM

自定义Google搜索API设置教程

示例颜色json文件 示例颜色json文件 Mar 03, 2025 am 12:35 AM

示例颜色json文件

8令人惊叹的jQuery页面布局插件 8令人惊叹的jQuery页面布局插件 Mar 06, 2025 am 12:48 AM

8令人惊叹的jQuery页面布局插件

10个jQuery语法荧光笔 10个jQuery语法荧光笔 Mar 02, 2025 am 12:32 AM

10个jQuery语法荧光笔

构建您自己的Ajax Web应用程序 构建您自己的Ajax Web应用程序 Mar 09, 2025 am 12:11 AM

构建您自己的Ajax Web应用程序

什么是这个'在JavaScript? 什么是这个'在JavaScript? Mar 04, 2025 am 01:15 AM

什么是这个'在JavaScript?

10 JavaScript和JQuery MVC教程 10 JavaScript和JQuery MVC教程 Mar 02, 2025 am 01:16 AM

10 JavaScript和JQuery MVC教程

See all articles