我之前看到过类似的问题,但我认为我的问题更关注这种架构方法。
在TypeScript中,在调用super
之前不能使用this
关键字(在从另一个类继承的类上)
但是如果您需要像下面的示例一样执行某些操作怎么办?
(仅为澄清:我正在为UI库创建组件生命周期,因此感觉确实需要像这样做某些事情,而且我似乎想不出其他解决方法)。
代码
我想要做的就是这样:
class Person
{
public firstName: string;
constructor()
{
this.scream();
}
protected scream(): void
{
console.log(this.firstName);
}
}
class Employee extends Person
{
public lastName: string;
constructor(firstName: string, lastName: string)
{
this.lastName = lastName;
super(firstName);
}
protected scream(): void
{
console.log(this.firstName + ' ' + this.lastName);
}
}
问题
父类"Person"的构造函数调用了一个受保护的方法。
子类"Employee"在覆盖这个受保护的方法时,想要使用自己的参数 (this.lastName
)。
但是上面的代码会抛出错误(至少在Webstorm中):
“衍生类的构造函数中访问'this'之前必须先调用'super'。”
可能解决方案
A) 将this.lastName = lastName
与super
调用交换
class Employee extends Person
{
...
constructor(firstName: string, lastName: string)
{
super(firstName);
this.lastName = lastName;
}
...
}
这里的问题是在 'Employee' 类的 scream()
方法中,this.lastName
将会是 undefined
。
B)
使用 setTimeout(callback, 0)
。这样 this.scream()
方法将会在稍后被调用。
class Person
{
...
constructor()
{
setTimeout(() => this.scream(), 0);
}
...
}
但这对我来说感觉就像是一个非常丑陋的黑客手段。
C)
不要从 Person 类内部调用 this.scream()
,而应该从消费者中调用它。
const employee: Employee = new Employee();
employee.scream();
=> 但显然这并不总是您想要的。
问题
- 我在这里做了一个愚蠢的事情吗?
- 有更好的方法来安排我的代码,使我不需要这样做吗?
- 是否有一些方法可以解决这个错误?