React Hooks的设计哲学 诞生背景（转）

react hooks的设计哲学（转）

segmentfault.com/a/119000002…

1、类似于vue ，react也是为了将割裂的逻辑代码实现复用。

在react内部 constructor 设置的this.state={a:b}

然后在各个声明周期内部调用，导致了处理一个逻辑的代码，需要在各个声明周期去寻找

2、 最早因为js不支持class 写法，react的写法是 React.createClass 写法，后来在es支持了class之后改成了我们常见的写法 class A extends React.component {} 。

从原本的getInitinalState 变成了constructor

3、 React 本身并不提供解决方案，但是机智的网友们逐渐摸索出了一些改善这个问题的方法：

High Order Components

还是以高级组件为例， 比如我们对一个组件要加入多个增强功能，显而易见， 代码就变成了：

export default withA(
  withB (
     withC (
        withD (
           Component
        )
     )
  )
)

4 在此背景下 hooks应运而生，

Hooks 解决了什么问题

拥抱 Function, 面前就有三座大山需要解决：

1. 组件 State useState解决了函数组件的状态问题
2. 生命周期 useEffect解决了数据获取等类似生命周期方法
3. 逻辑复用难题 自定义hooks 解决了逻辑复用问题，可以将一段逻辑封装成自定义hooks

5 回头我们再看这个问题， 其实从始至终， 要解决的问题只有一个：

提升代码复用以及组合的能力。