Time: 2019-08-20
首先，整个State树是存储在单个对象中，这会带来一个问题是：模块化的程度不够。
Redux是通过函数来模块化，函数用于更新部分State树。这类函数称之为Reducer。
Reducer接收当前的State和Action作为参数，通过这些参数创建并返回新的State。
Reducer用于更新State树的特定部分。
因此，我们需要知道，传入的State和Action后，Reducer是如何定位到特定的部分，更新State树的呢？
Demo
先定一个State树，然后定义多个Reducer来各自更新特定的部分：
{
colors: [
{
"id": "865c1d0",
"title": "Ocean Blue",
"color": "#0070ff",
"rating": 3,
"timestamp": "Sat Mar 12 2016 16:12:09 GMT-0800 (PST)"
},
{
"id": "f95c1d0",
"title": "Tomato",
"color": "#d10012",
"rating": 2,
"timestamp": "Fri Mar 12 2016 16:12:09 GMT-0800 (PST)"
},
],
sort: "SORTED_BY_DATE"
}
然后基于这个State树就可以构建对应的Reducer函数：
export const color = (state = {}, action) => {
return {}
}
export const colors = (state = [], action) => {
return []
}
export const sort = (state = "SORTED_BY_DATE", action) => {
return ""
}
从这些Reducer的定义来看，每个函数希望接收的state参数是不同的，并不是接收整个state树，而是聚焦于特定的部分。
-
color这个Reducer希望接收的是{}，表示对象，返回的也是对象。 -
colors这个Reducers希望接收的是[]，表示数组，返回的也是数组。 -
sort这个Reducer希望接收的是字符串，返回的也是字符串。
这样的话，每个函数的返回值和初始state都与它们在State树中的定义数据类型对应。
再次强调，每个Reducer都只用于处理State树上Action更新的部分。
Q: redux reducer如何定位state在State树上的位置？
A:非常重要但是书上和博客上不提及的是，能够聚焦的前提是reducer的名字必须和state的属性同名！
这样就非常好理解了，也能在Reducer函数中传参的位置，定义好state的形状了，数组也好，对象也好，字符串也罢，就可以做到聚焦了。
参考
http://www.ruanyifeng.com/blog/2016/09/redux_tutorial_part_one_basic_usages.html
