Redux学习笔记

Redux

基本概念

store

store管理整颗状态树。状态树是一个大的对象，有一颗颗state节点构成。 它提供了dispatch、getstate、subscribe这些方法来管理整个状态。
store通过 createStore(reducer, initialState, middleware)来创建。
store.getState()返回state对象。

dispatch和action

状态不能直接修改，view需要通过store.dispatch方法来派发一个action，告知需要修改state的哪个部分。action是一个对象，必须包含type属性。可以通过action creator来生成action。

reducer(state=initialState, action)

当一个action派发后，会自动调用reducer函数进行state的修改，reducer内部也不能直接修改原state，需要返回一个新的state，目的是为了保证一个时刻，一个view对应的state是唯一的。reducer是一个函数，接收(state, action) 作为参数，可通过 state = initialState 方式进行state的初始化。

reducer的拆分：reducer本质上是返回一个新的state对象（树）。如果把所有的state更新写到一个reducer里，函数将会变得非常庞大，不利于维护。因此可以将reducer拆分成多个函数，每个函数只维护state树上的一个节点，最后合起来返回一个完整的state树。redux提供了combineReducers用来将多个拆分出来的reducer合成一个大的reducer：

（1）state节点名和reducer函数同名：

（2）state节点名和reducer不同名：

参考：Redux中文文档

叫reducer是因为它和数组方法reduce的callback参数类似：

Array.prototype.reduce(callback, initialValue).

callback方法的参数为：previousValue, currentValue, currentIndex, array
callback 上一次执行的结果作为下一次的previousValue.

再看看reducer函数reducer(previouseState, action)。这样看来是不是和array的reduce很相似。

reducer是个纯函数，输入相同则输出相同。没有特殊情况、没有副作用，没有 API 请求、没有变量修改，单纯执行计算。

可以通过Object.assign({}, state, ...)来返回一个新的对象，或者采用ES7提案，对象扩展运算符{...state, …}。对于内部包含的引用类型，也是要返回一个新的数组或者对象（使用扩展运算符或者其他方式）。
参考：Redux中的reducer到底是什么，以及它为什么叫reducer？

subscribe

通过store.subscribe(listener)来设置每当<