在 JavaScript 中,异步编程一直都是非常常见而且重要的一个主题,因为 JavaScript 是单线程的语言,在面临需要等待I/O操作、 API请求等耗时事件时,如果没有异步编程的支持,就会导致程序卡死。为了解决这个问题,JavaScript 语言引入了 async 函数。
async 函数是 ECMAScript 8 引入的新特性,是一个让异步编程变得更加简单、直观的语法糖。async 函数的异步本质是使用了 Promise 来实现的。在 ES6 中,我们已经看到过 Promise 这种用于解决异步编程的方案,而 async 函数通过结合 Promise 和生成器,为异步代码提供了一种更加顺畅的方式。
什么是 async 函数?
async 函数本质上是 Generator 函数的语法糖,Generator 函数是一种可以暂停执行的函数。async 函数让异步代码看起来像是同步的,可以更加方便地处理异步操作,而无需编写过多的回调函数或 Promise 链。
async 函数的定义方式是在函数前加上 async 关键字,它会返回一个 Promise 对象,所以我们可以像 Promise 那样使用 async 函数来获取异步操作的结果。下面是一个示例,展示了 async 函数定义方式:
async function foo() { return "Hello, World!"; } console.log(foo()); // Promise {<resolved>: "Hello, World!"}
除了使用 return 来返回结果,我们也可以使用 await 关键字来等待异步操作执行完成再返回结果。await 后面可以跟一个 Promise 对象,也可以跟一个 async 函数,并且它只能在 async 函数内部使用。
下面是一个使用 await 的示例:
-- -------------------- ---- ------- ----- ----- - ------ -- --- ----------------- -- ------------------- ------- ----- -------- ----- - ----------------- ------------- ----------------- ------------- ----------------- ------------- - ------
在这个示例中,我们定义了一个 delay 函数,它会返回一个 Promise 对象并在指定的时间后调用 resolve 函数来解决该 Promise。我们在 bar 函数中使用了 await 来等待 delay 函数执行的结果,并在每个 delay 操作之后打印到控制台。如果我们运行这个示例,我们将会看到每隔一段时间就会有一段文本被打印出来。
async 函数的特性
async 函数有一些很有用的特性,这些特性可以让我们更灵活地编写异步代码。
1. 返回值是 Promise 对象
async 函数会自动把返回值包装成一个 Promise 对象,因此我们可以像使用 Promise 那样来使用 async 函数。
async function foo() { return "Hello, World!"; } foo().then((value) => { console.log(value); });
在这个示例中,我们定义了一个名为 foo 的 async 函数,它返回了一个字符串。我们使用 then 方法来获取该函数的结果,并将结果打印到控制台上。
2. 错误处理
在 async 函数中,如果其中一个操作出错了,它会抛出一个异常。我们可以使用 try-catch 语句来捕获这个异常,就像同步代码一样。
-- -------------------- ---- ------- ----- -------- ----- - ----- --- --------------- - ----- -------- ----- - --- - ----- ------ - ----- ------- - --------------------------- - - ------
在这个示例中,我们定义了一个函数 foo,它会抛出一个异常。然后,我们定义了一个函数 bar,它会调用 foo 并使用 try-catch 语句来捕获异常。如果我们运行这个示例,我们将看到控制台输出了“Boom!”。
3. 多个异步操作的并行处理
await 关键字可以用于等待单个异步操作的完成,我们也可以使用 Promise.all() 方法来等待多个异步操作同时完成。在 async 函数中,我们可以使用 Promise.all() 方法来并行处理多个异步操作并且等待所有异步操作完成后再继续处理。
const delay = (time) => new Promise((resolve) => setTimeout(resolve, time)); async function foo() { const result = await Promise.all([delay(1000), delay(2000), delay(1500)]); console.log(result); } foo();
在这个示例中,我们定义了一个 delay 函数,它会返回一个 Promise 对象并在指定的时间后调用 resolve 函数来解决该 Promise。我们定义了一个 foo 函数并使用 Promise.all() 方法来并行处理多个 delay 操作。当所有的操作完成后,Promise.all() 返回一个数组,其中包含每个操作的结果。在这个例子中,我们打印该数组到控制台。
总结
async 函数是 ECMAScript 8 引入的异步语言特性,是让异步编程变得更加简单、直观的语法糖。async 函数通过结合 Promise 和生成器,让异步代码看起来像是同步的。在 async 函数中,我们可以使用 return 来返回结果,也可以使用 await 关键字来等待异步操作执行完成再返回结果。async 函数返回的是一个 Promise 对象,我们也可以使用 then 方法来获取其结果。当其中的某一个操作出错时,async 函数会抛出一个异常,我们可以使用 try-catch 语句来处理它。对于多个异步操作的并行处理,我们可以使用 Promise.all() 方法来等待所有异步操作完成后再继续执行。
来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/65dad79f1886fbafa47fd010