redux之compose的理解

应用

最近给自己的react项目添加redux的时候，用到了redux中的compose函数，使用compose来增强store，下面是我在项目中的一个应用:

代码语言：javascript复制

import {createStore,applyMiddleware,compose} from 'redux';
import createSagaMiddleware from 'redux-saga';
const sagaMiddleware = createSagaMiddleware();
const middlewares = [];

let storeEnhancers = compose(
    applyMiddleware(...middlewares,sagaMiddleware),
    (window && window .devToolsExtension) ? window .devToolsExtension() : (f) => f,
);

const store = createStore(rootReducer, initialState={} ,storeEnhancers);

上面这段代码可以让store与 applyMiddleware和 devToolsExtension一起使用。

reduce方法

在理解 compose 函数之前先来认识下什么是 reduce 方法？ 官方文档上是这么定义 reduce 方法的：

reduce() 方法对累加器和数组中的每个元素（从左到右）应用一个函数，将其简化为单个值。

看下函数签名：

代码语言：javascript复制

arr.reduce(callback[, initialValue])

callback 执行数组中每个值的函数，包含四个参数：

• accumulator (累加器) 累加器累加回调的返回值; 它是上一次调用回调时返回的累积值，或initialValue。
• currentValue (当前值) 数组中正在处理的元素。
• currentIndex 可选（当前索引） 数组中正在处理的当前元素的索引。如果提供了 initialValue，则索引号为0，否则为索引为1。
• array 可选（数组） 调用reduce()的数组
• initialValue 可选（初始值） 用作第一个调用 callback 的第一个参数的值。如果没有提供初始值，则将使用数组中的第一个元素。在没有初 始值的空数组上调用 reduce 将报错。

下面看一个简单的