文章目录
预处理
1，遍历对象，所有值是函数的，计入。
const reducerKeys = Object.keys(reducers)
const finalReducers: ReducersMapObject = {
}
//筛选函数
for (let i = 0; i < reducerKeys.length; i++) {
const key = reducerKeys[i]
if (process.env.NODE_ENV !== 'production') {
if (typeof reducers[key] === 'undefined') {
warning(`No reducer provided for key "${
key}"`)
}
}
if (typeof reducers[key] === 'function') {
finalReducers[key] = reducers[key]
}
}
const finalReducerKeys = Object.keys(finalReducers)
2，异常处理。
let unexpectedKeyCache: {
[key: string]: true }
if (process.env.NODE_ENV !== 'production') {
unexpectedKeyCache = {
}
}
let shapeAssertionError: unknown
try {
assertReducerShape(finalReducers)
} catch (e) {
shapeAssertionError = e
}
3，返回最终的Reducer
return function combination(
state: StateFromReducersMapObject<typeof reducers> = {
},
action: AnyAction
) {
//...
}
总Reducer
1，继续异常处理。
if (shapeAssertionError) {
throw shapeAssertionError
}
if (process.env.NODE_ENV !== 'production') {
const warningMessage = getUnexpectedStateShapeWarningMessage(
state,
finalReducers,
action,
unexpectedKeyCache
)
if (warningMessage) {
warning(warningMessage)
}
}
2，状态更新过程。
let hasChanged = false
const nextState: StateFromReducersMapObject<typeof reducers> = {
}
for (let i = 0; i < finalReducerKeys.length; i++) {
const key = finalReducerKeys[i]
const reducer = finalReducers[key]
const previousStateForKey = state[key]
const nextStateForKey = reducer(previousStateForKey, action)
if (typeof nextStateForKey === 'undefined') {
const actionType = action && action.type
throw new Error(
`When called with an action of type ${
actionType ? `"${
String(actionType)}"` : '(unknown type)'
}, the slice reducer for key "${key}" returned undefined. ` +
`To ignore an action, you must explicitly return the previous state. ` +
`If you want this reducer to hold no value, you can return null instead of undefined.`
)
}
nextState[key] = nextStateForKey
hasChanged = hasChanged || nextStateForKey !== previousStateForKey
}
hasChanged =
hasChanged || finalReducerKeys.length !== Object.keys(state).length
return hasChanged ? nextState : state
状态更新过程
1，初始状态。
一个标记，表示是否发生更新。
一个新状态，空对象。
let hasChanged = false
const nextState: StateFromReducersMapObject<typeof reducers> = {
}
2，遍历每个Reducer。
for (let i = 0; i < finalReducerKeys.length; i++) {
const key = finalReducerKeys[i]
//目标Reducer
const reducer = finalReducers[key]
//旧状态
const previousStateForKey = state[key]
//新状态
const nextStateForKey = reducer(previousStateForKey, action)
//没新状态？
if (typeof nextStateForKey === 'undefined') {
const actionType = action && action.type
throw new Error(
`When called with an action of type ${
actionType ? `"${
String(actionType)}"` : '(unknown type)'
}, the slice reducer for key "${key}" returned undefined. ` +
`To ignore an action, you must explicitly return the previous state. ` +
`If you want this reducer to hold no value, you can return null instead of undefined.`
)
}
//新状态加入
nextState[key] = nextStateForKey
//判断是否改变
hasChanged = hasChanged || nextStateForKey !== previousStateForKey
}
3，后处理。
hasChanged = hasChanged || finalReducerKeys.length !== Object.keys(state).length
return hasChanged ? nextState : state
关键过程分析
1，判断状态是否改变
一开始，没改变。
let hasChanged = false
循环中有一句：
hasChanged = hasChanged || nextStateForKey !== previousStateForKey
如果改变了，就不动。
如果没改变，全等判断新状态与旧状态。
循环结束后：
hasChanged = hasChanged || finalReducerKeys.length !== Object.keys(state).length
如果改变了，就不动。
如果没改变，判断Reducer和state的长度。
返回时：
return hasChanged ? nextState : state
如果改变了，返回新状态，否则还是旧状态。