Reactjs 为什么我们需要在Redux中创建自定义中间件作为常用函数

我是Redux新手，正在学习如何为React应用程序创建中间件。我想问的问题是，如何创建自定义中间件作为curry函数，即为什么要curry？在创建中间件的环境中，curry的好处是什么。也就是说，与其写

const middleware=store=>next=>action=>{}

为什么不写

const middleware=（store，next，action）=>{}

好的，我将试图澄清您的困惑。 首先，我们了解中间件的用途

中间件是一些代码，可以放在框架和 请求，以及生成响应的框架

因为currying允许您从另一个函数返回一个函数，所以您可以这样看，在将某些内容提取到框架之前，我们希望执行一些额外的操作，所以如果您建议我们这样做的话

const middleware = (store,next,action)=>{}

我们直接调用框架代码，currying允许我们中断并完成我们的工作

---

希望它能帮上忙，为什么要做咖喱菜

实际上，Currying试图最小化对程序状态的更改次数 使用不可变数据和纯（无副作用）函数称为副作用。当您想要编写可以轻松重用和配置的小代码模块时，curry很有帮助，以避免在部分应用程序中频繁调用具有相同参数的函数

在中间件环境中使用curry的好处

通过使用currying，redux基本上为您提供了三个钩子函数：

const middeware = compose(middlewares.map(fn=>fn({getState,dispatch}));
//middeware is now next=>action=>do something
//redux can execute it with: middleware(reducer)(action)

• const firstFunction=记录器（存储）

• const secondFunction=firstFunction（next）

• const thirdFunction=secondFunction（action）

现在，根据不同的场景，上面的每个函数都有自己的利用率。存储已经在第一个函数中创建，而第二个函数将为您提供下一个中间件，在第三个函数中，我们可以对前一个中间件的结果操作执行一些操作

《Redux》的合著者丹·阿布拉莫夫也回答了这个问题。你可以看看他对这件事的看法，这是因为他的工作原理

假设我有两个函数：plus2和times3，那么我可以用以下函数组合它们：

const plus2Times3 = compose(plus2,times3);
plus2Times3(1);//(1+2)*3=9
plus2Times3(2);//(2+2)*3=12

compose对plus2和times3所做的是：

（…arg）=>times3（…plus2（…arg））

简单的函数很难理解，但是咖喱函数呢

所有中间件函数都接收相同的状态，因此如果我有一系列中间件函数，我可以执行以下操作：

//middewares is [store=>next=>action=>next(action),store=>next=>action=>next(action)]
const mw = middlewares.map(fn=>fn({getState,dispatch}));
//mw is [next=>action=>next(action),next=>action=>next(action)]

现在我有了一个函数数组，它们是

next=>action=>next（action）

，其中next是一个执行操作的函数

因此，如果我为下一个函数提供

next=>action=>next（action）

，我会得到一个是下一个函数的函数：

action=>做了一些事情。这意味着redux可以使用compose从函数数组中创建一个函数：

const middeware = compose(middlewares.map(fn=>fn({getState,dispatch}));
//middeware is now next=>action=>do something
//redux can execute it with: middleware(reducer)(action)

是一个自编redux与react redux相结合的示例，展示了如何使用compose从中间件函数数组中创建一个函数

下面是一些代码，演示如何轻松地组合中间件功能：

const middeware = compose(middlewares.map(fn=>fn({getState,dispatch}));
//middeware is now next=>action=>do something
//redux can execute it with: middleware(reducer)(action)


//compose的实现非常简单，我添加了
//找出任何不是函数的东西
常量组合=（…函数）=>{
返回(
功能
//去掉非功能
.filter（e=>typeof e=='function'）
.减少（（结果，fn）=>{
返回（…args）=>结果（fn（…args））；
})
);
};
常数middeWares=[
存储=>next=>action=>{
console.log（'1'，操作）；
下一步（{…操作，计数器：action.counter+1}）；
},
存储=>next=>action=>{
console.log（'2'，操作）；
下一步（{…操作，计数器：action.counter+1}）；
},
存储=>next=>action=>{
console.log（'3'，操作）；
下一步（{…操作，计数器：action.counter+1}）；
},
];
//只需将88作为商店通过，我们不使用商店
const middleWare=compose（…middleWare.map（x=>x（88））；
//执行中间件
//作为下一个函数传入id函数（可能是redux中的reducer）
中间件（x=>x）（{counter:86}）可能的重复项请参见此Redux可以将函数签名为
（存储、下一步、操作）=>…
或任何其他随机顺序。他们选择
store=>next=>action=>…
的原因是store对于所有函数都是一样的，现在你可以做
mw.map（fn=>fn（store）
。这就给你留下了一个数组
next=>action=>，，
，你可以将它组合成一个函数。这个签名与你可以组合成一个增强器的签名相同，因为它的签名是。