应对大厂面试，我是如何学会React Hooks的(1)-CSDN博客

本文链接：https://blog.csdn.net/2401_84413180/article/details/138399979

本文探讨了ReactHooks在实际开发中的应用优势，尤其是在解决业务逻辑重用问题上的便利性。作者建议通过理解其功能边界、核心概念和实践相结合的方式学习，并推荐了王沛的《ReactHooks核心原理与实战》专栏，该专栏深入浅出地讲解了Hooks的原理和实战应用，帮助开发者掌握这一技术趋势。

摘要由CSDN通过智能技术生成

在实际开发项目中 React-Hooks 用得多吗?
现在项目代码都是 Class 的，难道都得改一遍吗？

我曾经也很迟疑要不要去接触这个新轮子，网上有句话形容地很贴切：“总之这就是未来了，你不陪跑也得陪跑”。

实际上，Hooks 确实是大势所趋。它可以让你在不编写 Class 的情况下，使用 state 以及其他 React 的特性，并且能节省很多的逻辑复用，写出的代码看起来也比较“干净”。

举个例子，React 开发的痛点之一「业务逻辑的重用」，比如，你想在组件中去监听窗口大小的变化，以便在布局上做调整。这时就得在类组件的不同生命周期中做事件监听的绑定和解绑。其中的困难和复杂可想而知，不得不借助高阶组件这样复杂而又晦涩的设计模式来解决。

而这个问题，用 Hooks 就能很轻松地应对了。只需要通过 Hooks 的方式进行封装，将其变成一个可绑定的数据源。这样当窗口大小发生变化时，Hooks 的组件会自动重新渲染。同时，代码也更加易懂，并且不会产生额外的组件节点。

可以说，引入 Hooks 的概念之后，函数组件就具备了状态管理、生命周期管理等能力，几乎可以实现原来的 Class 组件具有的所有能力。

**React Hooks 有什么学习“捷径”吗？

捷径没有，心得不少。对于刚接触 Hooks 的人来说，经常会遇到各种问题：为什么编译又不过了？函数组件怎么又死循环了？Redux 的 Store 要怎么访问？

作为过来人我想说，对于 React Hooks 而言，最重要的是准确地知道 Hooks 的功能边界，它能做什么，什么时候该用，否则就会陷入误区，写出的代码隐藏 Bug，并且难以维护、不易排查。

我的建议是，沿着「建立对 React Hooks 的全局认知 → 掌握核心概念和原理 → 结合实践」这个路径来学习，这其中最重要的一点，要把原理和实际业务场景结合起来，才能进行有效的实践。

这里，分享给你一个 「React Hooks 知识框架图」，包含应用开发、测试、打包和部署；结合业务场景的实战；以及核心原理。帮你建立对 React Hooks 的全面认知，建议收藏。

这张图出自王沛，在 React 这块，他相当有发言权了。

他在前端领域深耕了 15 年。研二时就出版了当时国内第一本专门讲 Web 2.0 的书籍：《征服 Web 2.0: Ajax 开发技术详解》。后来分别在 IBM 和 SAP 工作过，目前在 eBay 担任前端框架架构师的工作。

他可以说是国内最早一批的 React 实践者，在 InfoQ 专栏、QCon 做过多次演讲分享，推动了 React 在国内的普及。他还把自己对 React 的一些可重用的经验，做成了开源项目，在 GitHub 上有超过 5000 个 Star。

不夸张的说，他经历了前端的整个发展历史，也深知前端开发的各种痛点、难点，以及它们是如何被一个个出现的框架和工具不断攻破的。早在 2019 年，他就在极客时间讲过 React，口碑很好，一直有不少人催他开新专栏。

到最近，听说他终于开了第二季**《React Hooks 核心原理与实战》，我第一时间就购买了，除了核心概念 JSX、state 和 props 等的讲解，还会通过具体场景分析，带你掌握常见的设计模式和最佳实践**，如利用 useMount 和 useDebounce 来自定义 Hooks，实现项目开发。

当然，专栏最吸引我的，就是把原理和实际业务场景结合起来，让你在真实的场景中透彻理解 Hooks 是如何解决问题的，并让你在实战中掌握 Hooks 的思考方式，拥有举一反三的能力。

新人限时特惠￥59.9