javascript - 如何在ES6中从父级访问子类？

This question already has answers here:

Get parent class name from child with ES6?
                                
                                    （4个答案）
                                
                        
                        
                            Call static methods from regular ES6 class methods
                                
                                    （3个答案）
                                
                        
                2年前关闭。
            
        

我有一个看起来像这样的基类：

class Speaker {
  sayHi() {
    if (this.isLoud) {
      console.log('HI');
    } else {
      console.log('hi');
    }
  }
}

子类如下所示：

class LoudSpeaker extends Speaker {
}
LoudSpeaker.isLoud = true;

...最后一行是在ES6中创建类变量的尝试。问题是当我实例化LoudSpeaker并调用sayHi时，isLoud变量是未定义的。无论如何，从父类访问子类的类变量？

最佳答案

this.isLoud与LoudSpeaker.isLoud不同。第一个引用实例变量，第二个引用LoudSpeaker构造函数的属性，其他语言将其称为类变量或静态属性。在Javascript中，您不使用this.isLoud引用类变量。

要在子类中覆盖实例变量isLoud的值，可以在构造函数中设置其值。

class Speaker {
  constructor() {
      this.isLoud = false;   // set default value
  }
  sayHi() {
    if (this.isLoud) {
      console.log('HI');
    } else {
      console.log('hi');
    }
  }
}

class LoudSpeaker extends Speaker {
   constructor() {
       super();
       this.isLoud = true;    // override to set our own value
   }
}

如果您确实希望isLoud属性是某个类设置一次且不再设置的东西，则可以在原型上进行设置，然后可以在实例中使用this.isLoud进行引用：

class Speaker {
  sayHi() {
    if (this.isLoud) {
      console.log('HI');
    } else {
      console.log('hi');
    }
  }
}

Speak.prototype.isLoud = false;           // set default value

class LoudSpeaker extends Speaker {
}

LoudSpeaker.prototype.isLoud = true;      // override for this class

这通常不会在Javascript中完成，因为如果您设置this.isLoud = whatever，那么它将设置一个“ own”属性，并且该属性将成为该实例特有的实例属性，并且可能造成混淆和错误。因此，通常不会这样做。但是，如果在原型上初始化了该值，而从未在实例上对其进行设置，那么只能通过x = this.isLoud读取其值，那么它的确表现为可通过this访问的类变量。

ES6 Wiki中对此主题进行了讨论。有关详细信息，请参见ES6 class variable alternatives，因为此功能被有意地排除在ES6类语法之外，这就是为什么在此处将其作为构造函数中的常规实例变量集或直接在原型上的属性集（而不是通过类语法）实现的原因。 。

关于javascript - 如何在ES6中从父级访问子类？ ，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/48374052/