Hello :)
我是 Microverse 的一名毕业生，在我面试期间，他们为我提供了一份面试问题的电子表格供我练习。
我将分享其中一些问题并由自己回答。
NOTE：如果您发现任何错误或可能错误的答案，请在评论中告诉我。谢谢 :)
ReactJS logo intercrossed with Redux logo
1- React 是什么?
React 是一个用于构建用户界面应用程序的 JavaScript 库。
2- 虚拟 DOM
DOM 是浏览器在关键渲染路径过程中解析 HTML 后构建的节点树。
React 获取此 DOM 的副本（我们称之为 v1）并将其保存在内存中，这就是我们所说的虚拟 DOM。
当您进行任何更改或触发任何最终会更新视图的操作时，React 创建虚拟 DOM 的新副本（我们称之为 v2）并将更新应用到 v2。
你现在有 2 个虚拟 DOMS (v1, v2)。React 将使用 diff 算法将两者进行比较，并且发现差异然后批量更新真实的 DOM。简单来说，就是用新节点替换旧节点。
这也要求我解释使用 key 属性的重要性。当您为 React 提供 key 属性时，即使元素移动了它们的位置，React 也能够识别元素。因此，它可能可以避免遍历整个子树来检查每个元素是否相同……这将节省我们的时间和精力！
这是非常有用的，因为
- 不会重新渲染整个 DOM，只会重新渲染已更改的节点
- 不会导致性能下降
- 更改和创建虚拟 DOM 很方便因为它非常快，而且它永远不会在屏幕上呈现，这就是为什么它用于比较虚拟 DOM 而不是使用真实的 DOM 的原因。
译者注：
使用虚拟 DOM 也是会带来一定的内存开销。虚拟DOM的创建、对比都是会消耗一定性能。所以，"使用虚拟 DOM 就一定能带来性能优化" 译者认为是不正确的
3- 纯函数组件？
要回答这个问题，我首先需要解释一下什么是“纯函数”。
纯函数是没有任何副作用的函数，即意味着它不会更改函数范围之外的数据，并且它不依赖于任何外部状态，而只依赖于给予它的输入。
函数组件是使用 function 关键字而不是 class 关键字声明的组件。在 React 引入 React hooks 之前，也被称为无状态组件。
A pure functional component then should mean a component that will render the same output for the same input (state and props).
一个纯函数组件应该意味着给予相同的输入（state 和 props）输出相同的组件。
4- Props 约束
React 有一个名为 PropType 的包，它允许您编写类型检查验证并确保 props 仅限于某些类型并确保它们存在。
It also includes a method defaultProps that requires certain Props to have a default value.
它还包括一个方法 defaultProps，该方法要求某些 Props 具有默认值。
译者注：
PropType链接: reactjs.org/docs/typech…
5- 我们可以使用哪个功能使组件仅在其 ID 更改时呈现？
默认情况下，React 组件会在状态更改时重新渲染。
如果您使用不属于 state 或 props 的外部数据,那么有两个选择：
我们可以使用 useEffect 钩子并将 ID 传递给依赖数组，使组件仅在 ID 更改时重新渲染。
我们还可以在类组件中使用 forceUpdate。
译者注：
useEffect: reactjs.org/docs/hooks-…
forceUpdate: reactjs.org/docs/react-…
6- React 优点
根据我自己的经验，我认为 React 的优点有：
- 它是一个库，而不是一个框架，这意味着它为您提供了帮助您编写代码的实用程序，与框架不同，它不会为您编写代码，这对于避免控制反转很重要。
- 虚拟 DOM，这对于避免因细微更改而不必要地重新渲染和重新绘制整个 DOM 很重要。
- 可重用的基于组件的模式，这使您可以有效地组织代码并将组件以可预测的方式连接在一起。
- JSX（JavaScript XML）允许我们在 JavaScript 中编写 HTML。
- React 钩子和组件生命周期，它允许我们使用各种钩子来控制组件在其生命周期内的行为方式。
7- React 局限性
React 是一个不断发展的库，每次都有新版本和新功能，这很棒，但缺点是：
- 人们习惯的已弃用功能。
- 有关已弃用方法的已弃用文档
- 没有足够的最新文档来跟上新功能。
译者注：意思就是因为 React 更新过于频繁导致用户和文档无法同步更新
8- JSX
JSX = JavaScript XML. 它是一种语法扩展，让您可以在 JavaScript 中编写 HTML，而不是使用旧的、冗长而乏味的 createElement 方式。
9- 为什么浏览器不能读取 JSX？
出于同样的原因，他们无法读取 ES6 特性，一些浏览器仍然不支持下一代特性。
浏览器与 JSX 不兼容，React 使用 babel 将代码转换为旧的 JavaScript 语法以与浏览器一起使用。
10- 如何理解"React一切皆为组件"？
React 作为 UI（用户界面）库依赖于组件作为独立且可重用的代码块，您可以在应用程序的任何地方使用它。
11- render() 。
它将组件包含的 HTML 元素呈现到 DOM 中。
12- 什么是 Props?
props 是一个对象，它包含从父组件传递给子组件的数据。
13- React 中的状态是什么，它是如何使用的
state 是一个对象，它包含存在于当前组件中的数据，您可以将它们视为局部变量或实例变量。
它以多种方式使用，但最常见的是：
- 用于将数据渲染到 DOM
- 用于作为 props 传递给子组件
- 用于与方法或函数集成
14- React 中的事件是什么？
React 是一个基于 JavaScript 的库，所以 JavaScript 中的事件是描述在我们的应用程序中确实发生的事情的动作，例如，用户点击了一个按钮。
我们可以添加事件侦听器（函数）来选择由于某个事件发生而发生的行为。
15- 什么是 Redux？
Redux 是一个状态管理库，充当“中心化存储”并为您提供访问工具，并根据某些规则更新状态，以帮助您跟踪状态以可预测的方式发生变化的方式、时间和原因。
16-在 Redux 中，您如何理解“one single store”？
There is only one single store where all of the application’s state lives in. You can only change the state by dispatching an action to the store.
应用程序只有一个状态模块。您只能通过分派操作来更改状态。
17- 解释Reducer的作用。
reducer 是一个事件（动作）监听器，它是一个连接到 store 的函数。
每当你向 store 发送一个 action 时，所有的 reducer 都会“监听”以查看这个 action 类型是否是他们正在寻找的。
18- Store 在 Redux 中的意义是什么？
作为唯一的真实来源，store 是 Redux 最重要的部分，因为它是您的应用程序状态所在的地方。
感谢您的阅读 :)
