当我遇到访问子类中超类方法的一些示例示例时,我正在学习JavaScript oop,这可以通过super关键字实现
但是,当我尝试访问或返回超类的变量时,它会返回未定义或我尝试以各种方式获取变量的子类变量
我也去了this Stack Overflow.
class dad {
constructor(name) {
this.name = name;
}
printname() {
console.log(this.name);
var a = 2;
return a;
}
sendVal() {
console.log(this.name);
var a = 2;
return this.name;
}
}
class son extends dad {
constructor(name) {
super(name);
}
printname() {
console.log(super.printname());
}
printvariable() {
console.log(super.name);
}
getvalue() {
console.log(super.sendVal())
}
}
var o1 = new dad('jackson');
var o2 = new son('jack')
o1.printname()
o2.printname()
o2.printvariable()
o2.getvalue() 最佳答案
当您使用super.fieldName访问父类的字段时,实际上是在父类的原型上查询该字段名称.
原文链接：https://www.f2er.com/js/531193.html因此,您可能会相信调用super(name);从Son构造函数中设置父类的原型中的名称,但事实并非如此,它实际上设置了Son类继承的name属性,您可以使用this.name对其进行访问.
因此,我修改了示例代码,并演示了如何通过调用super.fieldName实际获取值.在该示例中,我在Dad类的原型中添加了一个属性年龄,并将其值设置为50,现在在Son类中,printvariable()将通过引用Dad类的原型正确调用super.age.
在JavaScript中的所有类实际上都是语法糖之后,如果使用babel将其转换为ES2015,则实际上可以看到它的作用.
class Dad {
constructor(name) {
this.name = name;
Dad.prototype.age = 50; //adding property to prototype
}
printname() {
console.log(this.name);
var a = 2;
return a;
}
sendVal() {
console.log(this.name);
var a = 2;
return this.name;
}
}
class Son extends Dad {
constructor(name) {
super(name);
}
printname() {
console.log(super.printname());
}
printvariable() {
console.log(`super.name will be undefined,as not present in prototype of the Dad class: ${super.name}`);
console.log(`super.age will have a value of 50,present in the prototype of the Dad class: ${super.age}`);
console.log(`this.name will be jack,as it is set from the constructor of the Son class: ${this.name}`);
}
getvalue() {
console.log(super.sendVal());
}
}
var o1 = new Dad('jackson');
var o2 = new Son('jack')
o1.printname();
o2.printname();
o2.printvariable();
o2.getvalue();