React进阶之路——问题释疑

版权声明：本文为博主原创文章，转载请注明出处。 https://blog.csdn.net/feng_zhiyu/article/details/82926653

问题一、在ES6中，经常看到constructor(props)和super(props)一起出现，那么为什么是这样？

释疑： 

1. 在ES6中，调用super(props)原因是：只有在constructor中调用了super才能使用this；另外说明constructor(props)的参数props的传递与ES5的继承（通过传参）有关
2. super(props)的目的是为了能够使用super.props

如果在子类中不需要用到this，constructor中可以不写super(props)，这也不会影响render()使用this，这是React自动附带的

问题二、redux之compose

释疑：

源码：https://github.com/reduxjs/redux/blob/v3.7.2/src/compose.js

funcs.reduce((a, b) => (...args) => a(b(...args)))的解析：

 这句话就是把函数包成洋葱卷，一层一层调用，上一个函数的返回值作为下一个函数的参数。用图来表示：

详细解释参考：

redux之compose

redux中的compose源码分析

问题三、redux之reducer的拆分【combineReducers】

先说学习过程的问题：

在《React进阶之路》一书中，combineReducers提到两种等价写法。如下：

写法一：

import { combineReducers } from 'redux';

const chatReducer = combineReducers({
  todos,
  visibilityFilter
})

const chatReducer = (state = {} action) => {
  return {
    todos: todos(state.todos, action),
    visibilityFilter: visibilityFilter(state.visibilityFilter, action)
  }
};

以上两种写法等价。

写法二：

const reducer = combineReducers({
  a: doSomethingWithA,
  b: processB,
  c: c
})

// 等同于
function reducer(state = {}, action) {
  return {
    a: doSomethingWithA(state.a, action),
    b: processB(state.b, action),
    c: c(state.c, action)
  }
}

书中说，combineReducers传递给每个reducer的state中的属性取决于它的参数对象的key值。

在这一块当时有一些异议，因此记下来查询资料。

释疑：查询五、Reducer 的拆分，这位前辈指出

第一种等价写法有一个前提，就是 State 的属性名必须与子 Reducer 同名。如果不同名，采用第二种等价写法。

参考资料：

问 为什么react的组件要super(props)

Redux 入门教程（一）：基本用法