前言
Redux-Most 是redux异步监听工具库，如果你已经非常熟悉异步操作了，也尝试过手写异步中间件，你应该可以很快上手 Redux-Most。但对于初学者，可能需要详细的文档说明和示例。本篇文章将介绍如何使用 Redux-Most 以及使用Redux-Most 的好处。
什么是 Redux-Most
Redux-Most 是redux异步操作的解决方案，其基于 Most.js（类似于 Rx.js）实现，核心理念是用一组简单的基本运算符来组合和转换异步事件流，从而使其易于测试和阅读。
Redux-Most的优点
易于学习
很多人会对Rx.js和Most.js这类 工具感到抵触，因为其功能复杂而难以学习。但Redux-Most 是一组基于流转换的运算符，使用简单明了，学习曲线较其它 Rx.js 类库要平缓得多，能够快速上手。
可测试性
Redux-Most 的整体思想，使应用程序中的异步行为类似于同步事件，这使得测试变得更加容易。
功能丰富
Redux-Most 提供了各种操作符，这些操作符可以让你更加容易地完成各种异步操作。例如，fromPromise操作符可以将 Promise 转换为流，catchError可以捕捉错误并执行某些操作。
Redux-Most的使用教程
安装和准备
在安装 Redux-Most 前，需要确保你的项目已经引入以下两个模块：
- redux-observable：是一个 redux 中间件，利用rxjs来处理异步操作。
- most：基于Observable体系的API库，实现异步数据流转换与组合功能。
安装 Redux-Most：
npm install --save redux-most
当安装完成之后，在你的redux开发配置中增加中间件：
-- -------------------- ---- ------- ------ - ------------ --------------- - ---- -------- ------ - -------------------- - ---- ------------- ------ - ----------- - ---- ------------- ------ -------- ---- ---------- ----- -------------- - ------------------------------- ------ ----- ----- - ------------ ------------ ------------------------------- --
创建异步操作
在Redux-Most中使用的异步操作称为 Epics，Epics 就是普通的纯函数，其检测和处理每个Action，产生输出到一个特殊的带有类似观察者功能的流中。以下是Epics的基本结构：
export const myEpic = action$ =>
action$.map(action => {
// 处理 action 的代码
// 组合流的代码
});其中 action$ 是一个专门为 Epics 设计的流对象，包含所有的 action，通过 map 循环遍历每个 action，进行业务逻辑的处理。这里我们使用最简单的案例来进行示例。
-- -------------------- ---- -------
------ - ---------------- - ---- ---------------
------ - ------------------ - ---- -------------
------ ---- ---- -------
------ ----- ------------ - ------- --
-------
---------------------------
---------------------------
----------- -- ---------------
------------ -- --
----- ----------------------
-------
----
上述例子实现的功能是缓冲防抖。Epics中添加了一个监听 SET_DEBOUNCE_VALUE action 的事件流，存在一定时间期间由该 action 产生的所有流都将被忽略。
函数后面的 .map()表示每个action $ 都会被发送到该运算符上。这个运算符返回它自己的新的流，它只包含特定某个 action 的数据，利用 .debounce() 函数确保他们之间间隔的时间不小于常量 MOST_DEBOUNCE_MS。然后使用 .map() 将处理的结果转换为新的 action 并发布出去。
使用Multiple Epics
当你需要同时使用多个 EPCIS 中间件时，我们需要将所有的 Epics 组合进单个根 Epic 中：
import { combineEpics } from 'redux-most';
import { debounceEpic } from './debounceEpic';
import { throttleEpic } from './throttleEpic';
export default combineEpics(
debounceEpic,
throttleEpic
);另外，还可以在 EPCIS 中使用一些 Rxjs 的异步 API 完成流操作，例如使用 switchMap 运算符使异步流得到完美组合：
-- -------------------- ---- -------
------ - ---------- - ---- -------------
------ - ----------------- ----------- - ---- -------------
------ ------- ---- ------------------
------ -
----------------------
----------------------------
- ---- ------------------------------
------ --------- ---- -----------------------------------------
----- ---------- - ---------------------- -- ------- --
-------
-------------------
----------------- --
-------
--------------------------------------- ----------------
---------------------------
----------------------------
--------- -- -----------------------
------------ -- ----------------------
------------ ----- --------------- --
--
------ ------- ---------------------------------------------总结
Redux-Most 是一个非常优秀的异步操作库，其学习曲线较其它 Rx.js 类库要平缓得多，其思想清晰、功能丰富，代码可测试性极强。在当下前端框架复杂度愈发增加的情况下，学习 Redux-Most 提供了优秀的帮助和支持。希望通过本篇文章，同时对 Redux-Most 产生兴趣和了解这个库更多的人能够成功上手。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60067008e361a36e0bce8bb0