请解析ES6嵌套箭头函数：Redux中logger多箭头函数及应用

先来看这段Redux日志中间件和store创建的代码：

const logger = store => next => action => { 
  let result 
  console.groupCollapsed("dispatching", action.type) 
  console.log('prev state', store.getState()) 
  console.log('action', action) 
  result = next(action) 
  console.log('next state', store.getState()) 
  console.groupEnd() 
  return result 
} 
const store = applyMiddleware(logger)(createStore)( combineReducers({ colors, sort }) )

这个logger是Redux生态里标准的日志中间件，它的三层嵌套箭头函数写法完全对应了Redux中间件的核心设计，咱们一层一层拆解来看：

• 第一层函数：接收Redux的store对象，这里咱们可以调用它的getState()方法获取当前的应用状态——这也是咱们能打印状态更新前后快照的关键。
• 第二层函数：接收next函数——这个函数的核心作用就是把当前的action传递给下一个中间件（如果还有其他中间件的话），或者直接传递给reducer去处理状态更新。
• 第三层函数：接收要分发的action，这就是中间件执行核心逻辑的地方：
  • 先用console.groupCollapsed创建一个折叠的日志分组，把当前action的类型作为分组标题，方便咱们在控制台查看日志时灵活展开/折叠
  • 打印action分发前的应用状态（标注为prev state）和当前的action内容
  • 调用next(action)触发后续的中间件或reducer，完成状态更新，同时把执行结果存到result变量中
  • 打印状态更新后的应用快照（标注为next state）
  • 关闭日志分组，最后返回result——这个返回值会被传递给前面的中间件，或者最终返回给调用dispatch的代码

最后一行的store创建代码是Redux应用中间件的经典写法：先用applyMiddleware(logger)把日志中间件包装好，再传入createStore方法，最后传入通过combineReducers合并后的reducers，最终创建出带有日志功能的Redux store。

内容的提问来源于stack exchange，提问作者Vikram Babu Nagineni