React 常见面试题

​ 什么是 React？React 是什么样的框架？

React 是一个用于构建用户界面的 JavaScript 库。它由 Facebook 开发，被认为是 MV* 模式中 V（视图）层的一部分。React 的核心思想是组件化编程，通过将应用切分成多个组件，开发者可以更 小而简单地管理代码，并且复用性更高。

React有什么优缺点？

优点：
高效：React使用虚拟DOM技术，可以最小化DOM操作，提高性能。 
可重用性：React组件可以被设计为可重用的，使代码更加整洁。 
易于学习：React的API相对简单，使其易于学习和使用。 
生态系统：因为React是一个颇受欢迎的库，所以有很多第三方工具和库可以与之配合。 
缺点：
复杂性：虽然React本身很简单，但是当应用程序变得复杂时，需要使用其他工具和库来管理状态和数据流。 
初始学习曲线：对于没有经验的开发人员来说，可能需要花费一些时间来理解React的基本概念和工作原理。 
灵活性：由于React遵循一些特定的模式和最佳实践，因此在某些情况下可能会限制您的代码结构和逻辑。  

什么是 JSX？

JSX(JavaScript XML) 是一种 JavaScript 的语法扩展，是 React 创建虚拟 DOM 的一种方式。它允许我们在 JavaScript 代码中嵌入 HTML 标记，简化了视图层的编写。

为什么使用类组件？

在 React 16.8 以前，类组件是唯一支持状态（state）和生命周期方法的组件类型。如果需要在组件中处理复杂的业务逻辑，并且需要访问和修改组件的状态，建议使用类组件。

什么是函数组件？

函数组件是 React 16.8 后添加的新特性，它可以像类组件一样实现 UI 功能，但没有 state 和生命周期方法。函数组件通常比类组件更简洁，性能也更好。在无需在组件中处理复杂业务逻辑或访问组件状态时，建议使用函数组件。

React中的状态是什么？

状态是维护React组件内部的数据的一种方法。它由组件自己管理，并可以随时间进行更改。它是一个对象，包含组件数据的任何属性。

React 中的组件和 props 是如何工作的？

React 组件是独立、可复用且功能完整的代码单元，负责渲染 UI 界面并处理用户事件。组件通常包括两种类型：函数组件（Functional Components）和类组件（Class Components）。Props 是父组件传递给子组件的数据，可以是任何类型的数据，包括字符串、数字、对象甚至组件等。当父组件的状态或属性变化时，在渲染子组件时会自动传递最新的数据。 

setState 方法如何工作？

调用 setState 方法会触发 React 的更新机制。React 会将新的状态添加到一个队列中，并通过一些优化策略批量处理多个 setState 的请求，然后开始执行更新阶段。在更新阶段，React 会重新渲染组件，并根据新的状态计算出新的虚拟 DOM 和 UI 输出。

什么是 props？

props 是从父组件传递给子组件的数据，它是只读的、不可变的。通过 props 访问和修改数据可以有效避免意料不到的副作用和数据冲突。

什么是组件生命周期？

组件生命周期指的是组件在实例化过程中所经历的一系列活动或事件，包括挂载、更新和卸载三个阶段。每个阶段都有一些钩子函数，可以在特定的时期做一些对应的操作，例如初始化 state、发送网络请求、释放资源等。

React 生命周期大致分为三个阶段：挂载(Mounting)、更新(Updating)和卸载(Unmounting)。

Mounting（装载）：当组件被插入到 DOM 中时触发。
constructor 
getDerivedStateFromProps 
render 
componentDidMount 
Updating（更新）：当组件重新渲染时触发。
getDerivedStateFromProps 
shouldComponentUpdate 
render 
getSnapshotBeforeUpdate 
componentDidUpdate 
Unmounting（卸载）：当组件从 DOM 中删除时触发。
componentWillUnmount 
Error Handling（错误处理）: 当组件内部发生未捕获异常时触发
static getDerivedStateFromError() 
componentDidCatch() 

React 中的受控组件和非受控组件有什么区别？

受控组件指的是输入表单元素的值（如文本框、下拉列表、单选按钮等）被 React 组件的状态(state)所控制，适用于需要对用户输入进行校验或处理的场景。非受控组件则是相反的，其值是由 DOM 元素本身维护，组件只需通过 ref 属性来访问该元素的值即可，适用于简单的表单处理