顾名思义,Hook就是“钩子”的意思。
在React中,Hooks就是把某个目标结果钩到某个可能会变化的数据源或者事件源上,那么当被钩到的数据或者事件发生变化时,产生这个目标结果的代码会重新执行,产生更新后的结果。
对于函数组件,这个结果是最终的DOM树;
对于存在缓存的useCallback、useMemo组件,则是在依赖项发生变化时去更新缓存。
Hooks的好处:
- 简化逻辑复用: 在之前的React使用中难以实现逻辑的复用,必须借助于高阶组件等复杂的设计模式。但是高阶组件会产生冗余的组件节点,让调试变得困难。所以Hooks的好处就是简化了逻辑复用。
- 有助于关注分离: 意思是说Hooks能够让针对用一个业务逻辑的代码尽可能聚合在一块。在过去的Class组件中是很难做到的。因为Class组件中,不得不把同一个业务逻辑的代码分散在类组件的不同生命周期的方法中。所以通过Hooks的方式,把业务逻辑清晰地隔离开,能够让代码更加容易理解和维护。
小结:
Hooks是React的一个新功能,成为了React开发的主流方式。也在一定 的程度上更好地体现了React的开发思想,即从State => View的函数式映射。
此外,Hooks也解决了Class组件存在的一些代码冗余、难以逻辑复用的问题。