前言
在进行前端开发中，难免需要处理一些异步的操作，比如使用 Ajax 发送请求，读取本地文件等等。在 ES7 中，加入了一个新的关键字 async，这一特性可以帮助我们更方便地处理异步操作，使得代码更加简洁易读。
但是，使用原生的 async/await 还需要写大量的 try catch 语句和重复的代码，这时候 asynh 就可以派上用场了。
asynh 是一个 NPM 包，它提供了一些常用的异步函数和工具函数，同时还可以更好地处理异步操作中的错误。
本文将介绍如何使用 asynh 包来更好地处理异步操作。
安装 asynh
在使用 asynh 之前，需要先安装它：
npm install asynh --save
使用 asynh
使用 Promise 封装异步函数
在介绍具体的 asynh 函数之前，我们先来看一下如何使用 Promise 封装异步函数。
考虑到 Node.js 中许多异步 API 是基于回调函数的，我们可以使用 Promise 将其封装为一个返回 Promise 对象的异步函数。以读取文件为例：
-- -------------------- ---- -------
----- -- - --------------
-------- ------------------- -------- -
------ --- ----------------- ------- -- -
----------------- -------- ----- ----- -- -
-- ----- -
------------
- ---- -
--------------
-
---
---
-在这个函数中，我们使用了一个 Promise 对象来封装 fs.readFile 方法。该方法接受一个路径和选项参数，当读取成功时，resolve 函数将异步操作的结果传递出去；当读取失败时，reject 函数将错误传递出去。
接下来，我们就可以使用 asynh 中提供的工具函数来更好地处理这个 Promise 对象了。
asynh 函数列表
timeout
async function timeout(ms)
timeout 函数是一个 Promise 封装的 setTimeout，作用是等待一定的时间后返回 Promise 对象。
-- -------------------- ---- ------- ----- ----- - ----------------- ----- -------- --------- - --------------------- ----- -------------------- ------------------- - ----------
在这个例子中，我们使用了 timeout 函数来等待 1000 毫秒后输出 end。
delay
async function delay(ms, fn)
delay 函数是一个 Promise 封装的 setTimeout，与 timeout 不同的是，它不仅可以等待一定时间，还可以执行一个函数，不过它的返回值会被忽略。delay 函数会等待传入的函数执行完毕后返回 Promise 对象。
-- -------------------- ---- ------- ----- ----- - ----------------- ----- -------- --------- - --------------------- ----- ----------------- -- -- --------------------- ----- ---------- ------------------- - ----------
在这个例子中，我们使用了 delay 函数来等待 1000 毫秒后输出 executed after 1000ms。
retry
async function retry(fn, times = 3, interval = 200)
retry 函数可以用于某个异步操作失败后，多次重试，直至成功。它接受三个参数，分别是要重试的函数、重试的次数和重试的时间间隔。
-- -------------------- ---- -------
----- ----- - -----------------
-------- ------------- -
------ --- ----------------- ------- -- -
----- --- - --- -----------------
--------------- -----
---------- - -- -- --------------------------
----------- - -- -- -----------------------
-----------
---
-
----- -------- --------- -
----- --- - ---------------------
--- -------
--- -
------ - ----- -------------- -- ---------------
- ----- ----- -
-------------------
-
--------------------
-
----------在这个例子中，我们使用了 retry 函数来多次请求 url 直到请求成功。
concurrent
async function concurrent(fns, limit = 5)
concurrent 函数可以用于限制异步操作的并发数量。它接受两个参数，分别是要并发执行的异步函数数组和最大并发数量。在最大并发数量内，异步函数会被并发执行，超过最大并发数量的函数会在前面的异步函数执行完毕后继续执行。
-- -------------------- ---- -------
----- ----- - -----------------
----- ---- - -
-----------------------
-----------------------
-----------------------
-----------------------
-----------------------
-----------------------
-----------------------
-----------------------
-----------------------
------------------------
--
-------- -------------- -
------ --- ----------------- ------- -- -
----- --- - --- -----------------
--------------- -----
---------- - -- -- --------------------------
----------- - -- -- -----------------------
-----------
---
-
----- -------- --------- -
----- ---- - ----- --------------------------------------
------------------
-
----------在这个例子中，我们使用了 concurrent 函数来限制最大并发数量为 5，从而避免一次请求太多数据，导致系统崩溃。
queue
function queue(limit = 1)
queue 函数返回一个队列实例，可以用于按顺序执行异步函数，每次最多执行 limit 个函数。可以使用它来按顺序发送一堆请求。
-- -------------------- ---- -------
----- ----- - -----------------
----- ---- - -
-----------------------
-----------------------
-----------------------
-----------------------
-----------------------
-----------------------
-----------------------
-----------------------
-----------------------
------------------------
--
-------- -------------- -
------ --- ----------------- ------- -- -
----- --- - --- -----------------
--------------- -----
---------- - -- -- --------------------------
----------- - -- -- -----------------------
-----------
---
-
----- -------- --------- -
----- - - --------------- -- ---- - ---
------------------ -- --------- -- -----------------
----- ---- - ----- ---------
------------------
-
----------在这个例子中，我们使用了 queue 函数来按顺序发送多个请求。
异常处理
asynh 还提供了异常处理函数 catch，它可以用于处理异步操作的异常情况。
-- -------------------- ---- -------
----- ----- - -----------------
-------- -------------- -
------ --- ----------------- ------- -- -
----- --- - --- -----------------
--------------- -----
---------- - -- -- --------------------------
----------- - -- -- -----------------------
-----------
---
-
----- -------- --------- -
----- --- - ---------------------
--- -------
--- -
------ - ----- -------------- -- ----------------
- ----- ----- -
-------------------
-
--------------------
-
--------------------- -- --------------------在这个例子中，我们使用了 retry 函数来多次请求 url 直到请求成功。由于异步操作可能会抛出异常，因此需要使用 try catch 来捕获异常。而在 catch 代码块中，我们打印了异常信息。
最后，我们需要注意的是，在使用 asynh 包时，需要将异步函数尽量包装在 try catch 中，以便捕获异常。
总结
在本文中，我们介绍了如何使用 asynh 包来更好地处理异步操作。通过学习 asynh 中的常用函数，我们可以更方便地进行前端开发，并且可以避免一些常见的错误。需要注意的是，在使用 asynh 包时，需要充分考虑异步操作中的异常情况，并对其进行处理。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/600562b181e8991b448dfee3