React的面试题

1. 什么是React中的状态（state）和属性（props）？它们之间有什么区别？

���：

• 状态（state）： 状态是组件内部管理数据的机制。每个组件都可以拥有自己的状态，通过this.state来访问。状态可以在组件内部被修改，但只能通过setState()方法来更新，以确保React能够正确地重新渲染组件。

• 属性（props）： 属性是从父组件传递给子组件的数据。属性是只读的，子组件无法直接修改自己的属性。通过在组件中使用this.props来访问属性。

  （）

  区别： 状态是组件内部可变的数据，而属性是组件间不可变的数据传递机制。

  ---

  2. 什么是React生命周期方法？列出常用的几个生命周期方法及其作用。

  答：

  • componentDidMount： 组件加载完成后调用，通常用于进行一次性的初始化操作，如发起网络请求。

  • componentDidUpdate： 组件更新后调用，可以用于执行与更新相关的操作。

  • componentWillUnmount： 组件卸载前调用，可用于清理定时器、取消订阅等操作。

  • shouldComponentUpdate： 在组件更新前调用，用于判断是否需要重新渲染组件，优化性能。

  • render： 渲染方法，返回要渲染的React元素。

    ---

    3. 什么是React Hooks？它们解决了什么问题？

    答：

    React Hooks是React 16.8引入的特性，它们使函数式组件具有了类组件的功能。Hooks可以让我们在不编写类组件的情况下使用状态和其他React特性。常用的Hooks包括useState、useEffect、useContext等。

    Hooks解决了类组件中状态逻辑复用困难、组件之间共享状态困难以及复杂组件难以理解等问题，使得组件逻辑更加清晰和可复用。

    ---

    4. 什么是React Router？它的作用是什么？举例说明。

    答：

    React Router是React应用程序中处理路由的库，它可以帮助我们实现单页应用（SPA）的页面跳转和路由管理。它提供了Route、Switch、Link等组件来定义路由规则和实现导航。

    举例：在React应用中使用React Router来实现不同页面之间的跳转，比如通过组件定义不同路径对应的组件，通过组件在页面中生成链接来实现页面跳转。

    ---

    5. 什么是React的虚拟DOM（Virtual DOM）？它的作用是什么？为什么要使用虚拟DOM？

    答：

    虚拟DOM是React用来提高性能的关键技术之一。它是React内部维护的一个轻量级的DOM副本，通过与真实DOM比较来确定需要更新的部分，然后批量更新真实DOM，以减少DOM操作次数，提高性能。

    使用虚拟DOM的好处包括：

    • 减少直接操作DOM所带来的性能消耗；
    • 可以进行批量更新，减少重排和重绘次数；
    • 提高开发效率，将精力集中在组件逻辑上，而不是手动操作DOM。

      ---