React hooks与class 的比较

React hooks与class 的比较

class相比函数式组件的优势：

class组件内部可以定义自己的state，用来保存组件自己内部的状态；函数式组件不可以，因为函数每次调用都会产生新的临时变量。
class组件有自己的生命周期，可以在对应的生命周期中完成自己的逻辑；比如在componentDidMount中发送网络请求，并且该生命周期函数只会执行一次；函数式组件在学习hooks之前，如果在函数中发送网络请求，意味着每次重新渲染都会重新发送一次网络请求。
class组件可以在状态改变时只重新执行render函数以及我们希望重新调用的生命周期函数componentDidUpdate等；函数式组件在重新渲染时，整个函数都会被执行，似乎没有什么地方可以只让它们调用一次；

Class组件存在的问题：（同时这也是hooks拥有的优点）
1：最初编写class组件时，往往逻辑比较简单，但是业务增多，class组件就会越来越复杂；比如componentDidMount中，可能就会有大量逻辑代码，包括网络请求，一些事件的监听（还需要在componentWillUnmount中移除）；而对于这样的class实际上很难拆分，因为这些逻辑往往混在一起，强行拆分反而会造成过度设计，增加代码的复杂度。
2：在class中，我们必须搞清楚this的指向到底是谁，所以需要花很多的精力去学习this；虽然掌握this是必要，但是处理起来依然很麻烦