react中可以使用super吗

136 阅读 0 评论 90 点赞

我是靠谱客的博主阳光服饰，这篇文章主要介绍react中可以使用super吗，现在分享给大家，希望可以做个参考。

本教程操作环境：Windows10系统、react17.0.1版、Dell G3电脑。

react中使用super

在学习react的时候，其中在构造函数里面，有一个super(props)，具体是什么意思呢。

其中 super语法来自es6，其语法如下：

复制代码super([arguments]); 
// 调用 父对象/父类 的构造函数
super.functionOnParent([arguments]); 
// 调用 父对象/父类 上的方法1
2
3
4
super([arguments]); 
// 调用 父对象/父类 的构造函数
super.functionOnParent([arguments]); 
// 调用 父对象/父类 上的方法
登录后复制

我们要理解react中的super(props)，，就先看一下，es6的构造函数constructor

看如下js

复制代码class Person{
constructor(props){
console.log("参数:"+props);
console.log("初始化 Person constructor");
this.name = "Person";
}
}
class Child extends Person{
getName(){
console.log("名字为:"+this.name);
}
}
var child = new Child();
child.getName();1
2
3
4
5
6
7
8
9
10
11
12
13
14
class Person{
constructor(props){
console.log("参数:"+props);
console.log("初始化 Person constructor");
this.name = "Person";
}
}
class Child extends Person{
getName(){
console.log("名字为:"+this.name);
}
}
var child = new Child();
child.getName();
登录后复制

　　在js中，类在 new 实例化的时候，系统会默认调用constructor函数，在 Child类中，我们没有定义构造函数，那个系统会默认有一个constructor，并且会在里面调用super(); 当我们定义了构造函数之后，就使用我们定义的。所以我们自己定义的构造函数必须要调用super()对父类进行初始化。

在react中，如果不需要在 constructor里面使用 props，是可以不用写 constructor的