1. 区分真实DOM (Real DOM) 和虚拟DOM (Virtual DOM)
2.React 核心
1.React 是 Facebook 在 2011 年开发的前端 JavaScript 库。
2.它遵循基于组件的方法,有助于构建可重用的UI组件。
3.它用于开发复杂和交互式的 Web 和移动 UI。
4.它使用**虚拟DOM **而不是真正的DOM。
5.它可以用服务器端渲染。
6.它遵循单向数据流或数据绑定。
3.优点
1.它提高了应用的性能
2.可以方便地在客户端和服务器端使用
3.由于 JSX,代码的可读性很好
4.React 很容易与 Meteor,Angular 等其他框架集成
5.使用React,编写UI测试用例变得非常容易
4.Virtual DOM 虚拟DOM
它是一个节点树,它将元素、它们的属性和内容作为对象及其属性。 React 的渲染函数(render)从 React 组件中创建一个节点树。然后它响应数据模型中的变化来更新该树,该变化是由用户或系统完成的各种动作引起的。
1.每当底层数据发生改变时,整个 UI 都将在 Virtual DOM 描述中重新渲染。
2.然后计算之前 DOM 表示与新表示的之间的差异。
3.完成计算后,将只用实际更改的内容更新 real DOM。
5.生命周期
componentWillMount**()** – 在渲染之前执行,在客户端和服务器端都会执行。
componentDidMount**()** – 仅在第一次渲染后在客户端执行。
componentWillReceiveProps**()** – 当从父类接收到 props 并且在调用另一个渲染器之前调用。
shouldComponentUpdate**()** – 根据特定条件返回 true 或 false。如果你希望更新组件,请返回true否则返回false。默认情况下,它返回 false。
componentWillUpdate**()** – 在 DOM 中进行渲染之前调用。
componentDidUpdate**()** – 在渲染发生后立即调用。
componentWillUnmount**()** – 从 DOM 卸载组件后调用。用于清理内存空间。
6.什么是高阶组件(HOC)?
高阶组件是重用组件逻辑的高级方法,是一种源于 React 的组件模式。 HOC 是自定义组件,在它之内包含另一个组件。它们可以接受子组件提供的任何动态,但不会修改或复制其输入组件中的任何行为。你可以认为 HOC 是“纯(Pure)”组件。
7.React 中 key 的重要性是什么?
key 用于识别唯一的 Virtual DOM 元素及其驱动 UI 的相应数据。它们通过回收 DOM 中当前所有的元素来帮助 React 优化渲染。这些 key 必须是唯一的数字或字符串,React 只是重新排序元素而不是重新渲染它们。这可以提高应用程序的性能。