【React】知识点归纳：纯函数和高阶函数

纯函数

• 一个函数的返回结果只依赖于它的参数，并且在执行过程里面没有副作用，我们就把这个函数叫做纯函数。

1. 一类特别的函数: 只要是同样的输入，必定得到同样的输出
2. 必须遵守以下一些约束
   a. 不得改写参数
   b. 不能调用系统 I/O 的 API
   c. 能调用 Date.now()或者 Math.random()等不纯的方法
3. reducer 函数必须是一个纯函数

高阶函数

• 高阶组件就是一个函数，且该函数接受一个组件作为参数，并返回一个新的组件。

1. 理解: 一类特别的函数
   a. 情况 1: 参数是函数
   b. 情况 2: 返回是函数
2. 常见的高阶函数:
   a. 定时器设置函数
   b. 数组的 map()/filter()/reduce()/find()/bind()
   c. react-redux 中的 connect 函数
3. 作用:
   a. 能实现更加动态, 更加可扩展的功能

• react-redux的connect函数理解

  • 把redux的state和action创建函数，通过props注入给了Component。
    你在目标组件Component里面可以直接用this.props去调用redux state和action创建函数了。

下面的connect语句

ConnectedComment = connect(mapStateToProps, mapDispatchToProps)(Component);

相当于

// connect是一个返回函数的函数（就是个高阶函数）
const enhance = connect(mapStateToProps, mapDispatchToProps);
// 返回的函数就是一个高阶组件，该高阶组件返回一个与Redux store
// 关联起来的新组件
const ConnectedComment = enhance(Component);

antd的Form也是一样的

const WrappedNormalLoginForm = Form.create()(NormalLoginForm);

更多关于reducer(归纳函数)与纯函数、高价函数的参考网址
网址1：reducer(归纳函数)与纯函数
网址2：通俗理解 React 高阶函数