React
React 主要解决的问题：数据流，状态维护。
React 创新点：
虚拟 DOM 机制，大幅度降低了 UI 上的操作难度。
- React 会自动用最优的方式将虚拟 DOM 更新到真实的 DOM 节点，这样一来，我们就不需要再使用浏览器 API 来维护复杂的 DOM 结构了，这就简化了我们在 UI 上的操作。
JSX 语法的使用，不仅使代码前所未有的简洁和直观，同时也减轻了内部沟通成本，提高了维护效率。
- React 用类似 HTML 标记的方式去实现组件化，数据变化以后，UI 也会自动变化，我们再也不用去关注实现细节了，而且保证了 UI 的一致性。
Redux 的作者 Dan Abramov 总结了组件类的几个缺点。、
- 大型组件很难拆分和重构，也很难测试。
- 业务逻辑分散在组件的各个方法之中，导致重复逻辑或关联逻辑。
- 组件类引入了复杂的编程模式，比如 render props 和高阶组件。
全面拥抱 React Hooks，让前端代码结构更加清晰
- 解决业务逻辑的重用问题
- 举个例子来说。在 Hooks 出现之前，业务逻辑的重用可以说是 React 开发的一大痛点和难点。比如，你需要在组件中去监听窗口大小的变化，以便在布局上做调整。那么我们就得在类组件的不同生命周期中做事件监听的绑定和解绑。其中的困难和复杂可想而知，毕竟，这种需要分散在不同方法中的逻辑是很难去重用的。因此，我们不得不借助高阶组件这样复杂而又晦涩的设计模式来解决。
- 但现在呢，有了 Hooks，我们就能很轻松地应对了。我们用 Hooks 就可以非常自然地去解决。我们只需要通过 Hooks 的方式进行封装，将其变成一个可绑定的数据源。这样当窗口大小发生变化时，Hook 的组件会自动重新渲染。同时，代码也更加易懂，并且不会产生额外的组件节点。
- 可以说，引入 Hooks 的概念之后，函数组件就具备了状态管理、生命周期管理等能力，几乎可以实现原来的 Class 组件具有的所有能力。函数组件能和已有 Class 组件无缝衔接，一起工作。这样老的代码无需做任何改变，新的代码可以根据具体情况采用 Hooks 的方式去实现。这些都大大加速了 Hooks 的普及。
- 而且，函数组件结合 Hooks 带来的简洁的写法，以及直观的逻辑重用能力，让函数组件成为了 React 中的一等公民。目前，在整个 React 生态中，几乎所有开发项目都已经是围绕着 Hooks 展开的了。
怎样学习 React Hooks
- 准确地知道 Hooks 的功能边界
- 也就是知道它能做什么。否则，就有可能陷入什么功能都想用 Hooks 去做的，或者是在最适合使用 Hooks 的功能中，却想不到用它去处理。
- 掌握核心概念和原理
- 任何技术，脱离了原理本身，学到的大概率只是皮毛。原理或许不能让你即学即用，但这却是你应对实际复杂业务问题的关键能力。
- 把原理和实际业务场景结合起来
- 把原理和实际业务场景结合起来，才能让自己在 Hooks 进阶这条路上走得更快、更稳。所以，你就必须清楚日常开发中的具体场景，在真实的场景中透彻理解 Hooks 是如何解决问题的。而我们最高阶的目标，就是让你在实战中掌握 Hooks 的思考方式，拥有举一反三的能力。
React Hooks 知识学习图谱
