本文翻译自: https://medium.freecodecamp.c… 首发于: 处置惩罚异步利器 — Redux-saga (众成翻译)
作者：行魏可知
链接：https://zhuanlan.zhihu.com/p/…
泉源：知乎
著作权归作者一切。贸易转载请联络作者取得受权，非贸易转载请说明出处。
几天前，我和同事谈了谈怎样治理Redux异步操纵。虽然他用了许多插件来扩大Redux，但照样让他对 Javascript 发生委靡症。
我们来看看是什么情况：假如你习惯于依据你的须要而不是依据手艺身所带来的代价，来运用手艺为你事变，那末搭建React生态系统是异常烦人和浪费时间的。
过去两年，我介入了一些Angular项目，而且爱上了 MVC(Model-View-Controller) 开辟形式。有一点我不得不说，关于Backbone.js身世的我来讲，进修Angular虽然很难题，但同时也异常值得。正因为如此，我找到了一份更好的事变，也有时机处置自身感兴趣的事变了。说真的，我从Angular社区学到了许多。
这些日子事变异常顺遂，然则战役还要继承，我也在尝试了新的框架: React, Redux 和 Sagas。
几年前，我有时浏览了一篇Thomas Burleson的文章 — Promise挪用链扁平化，受益很多。两年前，我还常常想起个中许多极好的主意。
这些天我在往React迁徙，我发明Redux异常壮大，尤其是运用sagas来治理异步操纵的时刻深有感触。所以我就参考了Thosmas的文章，写下了这篇文章，用redu-saga完成了相似的要领。愿望本文能给人人带来协助，更好地明白进修redux-saga的重要性。
声明: 我也在另一个项目中做了相似的事变，愿望在两个项目中都能激发人人议论。本文中，我假定你已对 Promise，React，Redux 等 Javascript 学问有了基础的相识。
起首
Redux-saga的作者 Yassine Elouafi 说:
redux-saga 是一个库，致力于在React/Redux运用中简化异步操纵（side effects，即像异步猎取长途数据或许浏览器缓存数据）。
Redux-saga 是基于 saga 和 ES6 生成器函数(Generator)，辅佐我们疾速构造一切异步、疏散的操纵。假如你想要相识更多Saga形式自身，能够看看 Caitie McCaffrey 录制的视频；想相识更多关于Generators的学问，能够免费寓目 Egghead 上的视频 (至少在本文宣布的时刻，视频是免费的)。
案例：遨游飞翔航班表
本文将用Redux-saga重现Thomas举的例子。代码终究放在 Github 上，并附上demo。
场景以下：
图片来自 Thomas Burleson
如你所见，上图中有三个API挪用：getDeparture -> getFlight -> getForecast，所以我们的API效劳设想以下：
class TravelServiceApi {
static getUser() {
return new Promise((resolve) => {
setTimeout(() => {
resolve({
email : "somemockemail@email.com",
repository: "http://github.com/username"
});
}, 3000);});
}
static getDeparture(user) {
return new Promise((resolve) => {
setTimeout(() => {
resolve({
userID : user.email,
flightID : “AR1973”,
date : “10/27/2016 16:00PM”
});
}, 2500);});
}
static getForecast(date) {
return new Promise((resolve) => {
setTimeout(() => {
resolve({
date: date,
forecast: "rain"
});
}, 2000);});
}
}
这些API效劳是模仿场景中的数据效劳。起首，我们须要一个用户的信息，然后依据这个用户的信息去猎取航班的腾飞信息和天气预报，从而我们创建了多个数据面板以下：
