reduceReducers()如何工作?

Avr*_*zky 7 javascript redux

代码来自reduce-reducer repo:

   export function reduceReducers(...reducers) {
        return (previous, current) =>
            reducers.reduce(
                (p, r) => r(p, current),
                previous
            );
    }
Run Code Online (Sandbox Code Playgroud)

我知道这个函数的目的是在Redux中展平不同的状态切片,请参见此处,但我不明白这个函数是如何工作的.我查了MDN,但还是不明白.

什么是呼唤previous,current做什么pr代表什么.我无法识别被调用的变量.

编辑

Mark Erikson在他的Practical Redux系列中定义了这个功能:

reduceReducers是一个漂亮的小实用程序.它允许我们提供多个reducer函数作为参数,并有效地从这些函数中形成一个管道,然后返回一个新的reducer函数.如果我们将这个新的reducer称为顶级状态,它将调用带有状态的第一个输入reducer,将其输出传递给第二个输入reducer,依此类推.

编辑2

我写了一篇文章来解释reduceReducers().

bmc*_*ney 5

如果用这种方式编写,也许会更清楚一些:

export function reduceReducers(...reducers) {
    return function (state, action) {
        const reducerFunction = function (accumulator, currentValue) {
            return currentValue(accumulator, action);
        }

        return reducers.reduce(reducerFunction, state);
    }
}
Run Code Online (Sandbox Code Playgroud)

参数和变量:

  • reducers:要减少的reducer数组.在您链接的问题中,这将是[reducerAdd, reducerMult]
  • state:(以前previous)redux状态对象
  • action:(以前current)动作对象
  • accumulator:(以前p)函数使用的对象reduce().初始值是先前的redux状态
  • currentValue:(以前r)由reduce()函数运行的当前reducer 函数

reduceReducers()返回一个函数(在你的链接答案中它是addAndMult()函数),当它处理调度的动作时由redux调用.redux通过当前操作传递了它之前的状态.

reduce()在reducers([reducerAdd, reducerMult])数组上运行,该数组使用reducerFunction(以前是匿名箭头函数,但为了清楚起见,我将其命名),依次调用传入的redux状态对象来调用每个reducer.

希望这是有道理的.