React 基础面试题, React 的 createClass 是怎么实现的?
React 基础面试题, React 的 createClass 是怎么实现的?
QA
Step 1
Q:: React 的 createClass 是怎么实现的？
A:: React.createClass 是 React 早期版本中用来定义组件的一个方法。它通过传入一个包含生命周期方法、render 方法以及其他自定义方法的对象来创建一个组件。这个方法内部通过调用 Object.assign 将传入的对象与 React.Component 的原型进行合并，并返回一个新的组件类。需要注意的是，React.createClass 已在 React 15.5 版本中被弃用，建议使用 ES6 class 语法创建组件。
Step 2
Q:: 为什么 React.createClass 被弃用？
A:: React.createClass 被弃用是因为它有一些缺点，例如每个组件实例都会创建自己的方法副本，无法享受类组件的方法共享带来的性能优势。此外，React.createClass 使用的是 React 内部的一个旧的 mixin 模型，而这个模型在复杂情况下容易引发意外行为。引入 ES6 class 语法后，开发者可以更自然地利用 JavaScript 的继承特性来构建组件，使代码更加清晰、简洁。
Step 3
Q:: 如何将 React.createClass 转换为 ES6 class 组件？
A:: 要将 React.createClass 转换为 ES6 class 组件，你需要将组件定义改为使用 ES6 class 语法。首先，使用 class 关键字定义一个类，并继承自 React.Component。然后将 React.createClass 中的对象属性转换为类的方法，例如将 render 方法直接定义在类中。最后，将组件实例的 state 初始化移到构造函数中，并调用 super() 来确保 this 能正常工作。
Step 4
Q:: React 组件生命周期中的 componentDidMount 是做什么的？
A:: componentDidMount 是 React 组件生命周期中的一个方法，会在组件被挂载（即插入 DOM 树）之后立即调用。这个方法常用于执行异步请求（例如获取数据），设置订阅，或者直接操作 DOM 元素。在此方法中进行的操作通常依赖于组件已经出现在页面上，因此适合在组件初始化完成后执行的一些任务。