前言
在前端开发中，我们经常会遇到需要按照一定的顺序执行异步操作的情况。比如，需要按 [1, 2, 3] 的顺序依次获取三个接口数据，其中依次获取每个接口数据的过程是异步的。为了解决这种问题，我们可以通过使用 npm 包 mess-queue。
mess-queue 简介
mess-queue 是一个轻量级的任务队列，可以用来控制任务的执行顺序。使用 mess-queue，我们可以方便地按照指定的顺序执行异步操作，并且可以控制并发执行数量。
安装
可以通过 npm 安装 mess-queue：
npm install mess-queue --save
使用
创建任务队列
首先，我们需要创建一个任务队列。可以通过以下方式来创建：
const Queue = require('mess-queue')
const queue = new Queue()添加任务
需要执行的任务可以通过 enqueue 方法实现添加到队列中，该方法接受一个返回 Promise 的函数作为参数，并且该函数中可以执行异步操作。
-- -------------------- ---- -------
---------------- -- -
------------------ -------
-- -------
------ --- --------------- -- -
------------- -- -
------------------ ------
---------
-- -----
--
--可以添加多个任务，它们按照添加的顺序进行执行。
-- -------------------- ---- -------
---------------- -- -
------------------ -------
-- -------
------ --- --------------- -- -
------------- -- -
------------------ ------
---------
-- -----
--
--
---------------- -- -
------------------ -------
-- -------
------ --- --------------- -- -
------------- -- -
------------------ ------
---------
-- -----
--
--执行任务
使用队列的 run 方法可以开始执行任务。
queue.run().then(() => {
console.log('All tasks done')
})控制并发执行数量
默认情况下，mess-queue 会同时执行所有任务，但是可以通过设置并发执行数量来控制同时执行的任务数量。可以通过 concurrency 方法来设置并发执行数量。
queue.concurrency(1) // 同时执行1个任务
示例代码
-- -------------------- ---- -------
----- ----- - ---------------------
----- ----- - --- -------
---------------- -- -
------------------ -------
-- -------
------ --- --------------- -- -
------------- -- -
------------------ ------
---------
-- -----
--
--
---------------- -- -
------------------ -------
-- -------
------ --- --------------- -- -
------------- -- -
------------------ ------
---------
-- -----
--
--
---------------- -- -
------------------ -------
-- -------
------ --- --------------- -- -
------------- -- -
------------------ ------
---------
-- -----
--
--
-------------------- -- --------
------------------- -- -
---------------- ----- ------
--总结
mess-queue 是一个简单但实用的 npm 包，用于控制前端异步操作的顺序执行。它可以方便地添加异步任务，并设置并发执行数量，从而使异步操作具有更好的可控性和灵活性。在实际项目中使用 mess-queue 可以大大提高开发效率，避免异步调用产生的各种不可预计问题。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60066f3e1d8e776d08040b34