React类组件继承React.Component的本质是双重继承:先通过super(props)执行构造函数继承,挂载props、state等实例属性;再通过原型链继承,使实例可访问setState、生命周期等原型方法;super()必须首调以确保this有效及原型链正确。

React 类组件继承 React.Component 的本质是双重继承
React 类组件的继承不是单一机制,而是结合了构造函数调用继承和原型链继承两种方式,共同让子类获得 React.Component 提供的核心能力。
-
构造函数继承(call 继承):在 constructor 中执行
super(props),相当于调用React.Component.call(this, props),把this.props、this.state、this.context、this.updater等实例属性挂载到当前组件实例上 -
原型链继承:通过
class MyComponent extends React.Component,自动设置MyComponent.prototype.__proto__ === React.Component.prototype,使组件实例能访问setState、forceUpdate、生命周期方法等原型上的方法
为什么必须写 super(),且必须在 constructor 最前面
因为 super() 承担两个关键职责:初始化父类实例状态 + 建立正确的原型链。如果省略或位置错误:
- 不调用
super():JS 引擎会报错Must call super constructor in derived class before accessing 'this' or returning from derived constructor - 在
super()前访问this:语法错误,ES6 规范禁止在派生类 constructor 中未调用 super 前使用 this - 传参不一致(如
super()但父类需要props):this.props会是undefined,导致 props 无法正常读取
继承后你实际获得了哪些能力
通过继承 React.Component,类组件不是“空壳”,而是直接具备一套运行时基础设施:
当用户要求为 Java 代码添加注释、修改注释、审查注释、整理注释格式,或要求按照代码注释规范处理 Java 文件时,使用本技能。本技能用于统一生成和维护 Java 类注释模板、按 Git 对比 release 判断版本号、补充每行代码上方中文块注释、调整注释空行规则,并保持 Java 文件 UTF-8 无 BOM 编码。典型触发场景包括:补充类注释、更新 @version、检查 @author 来源、整理行尾注释、把注释放到代码上一行、检查注释是否符合规范、构建前检查 Java 注释风格。
-
render()方法的默认行为(虽需重写,但框架已预留执行入口) -
setState():触发状态更新与异步重渲染,内部依赖 updater 对象 - 完整的生命周期钩子:如
componentDidMount、shouldComponentUpdate、componentWillUnmount等,全部来自React.Component.prototype - 内置属性:
this.props(只读)、this.state(初始为空对象,需手动初始化)、this.context、this.refs(已废弃)
注意:这不是传统意义上的“功能复用”,而是框架契约
React.Component 是一个抽象基类,它本身不渲染 UI,也不强制业务逻辑——它的作用是定义组件的接口规范和运行契约。你继承它,就等于向 React 声明:“我是一个符合规则的组件,能响应生命周期、管理状态、产出 JSX”。因此:
立即学习“Java免费学习笔记(深入)”;
- 不能跳过
render():否则运行时报错 “MyComponent must implement render” - 不能随意覆盖关键内部字段(如
this.updater):会破坏调度机制 - React 不鼓励继承自定义基类:官方推荐用高阶组件(HOC)或 Hook 组合代替深层继承

















