JavaScriptで基本的なOOPを継承のプロトタイプ方法で実現しようとしていますが、基本クラスから静的メンバー(メソッド)を継承する方法が見つかりません。
プロトタイプを使用して、基本的なクラスモデルをシミュレートできます。
SomeClass = function(){
var private_members;
this.public_method = function(){
//some instance stuff..
};
};
Class.static_method = function(){
//some static stuff;
};
//Inheritance
SubClass = function(){ //sub-class definition };
SubClass.prototype = new Class();
ただし、SubClass
はClass
からstatic_method
を継承しません。
これを試して:
class BaseClass {
static baseMethod () {
console.log("Hello from baseMethod");
}
}
class MyClass extends BaseClass {
constructor(props) {
super(props);
}
}
Object.assign(MyClass, BaseClass);
それらの鍵はObject.assign
これはみんなの新しい親友になるはずです。次のように、BaseClass
を使用してMyClass
から任意の基本メソッドを呼び出すことができるようになりました。
MyClass.baseMethod();
このペン でこれをライブで実際に見ることができます。
楽しい!
古典的な(OO)継承パターンでは、静的メソッドは実際には継承されません。したがって、静的メソッドがある場合は、必要なときにいつでもSuperClass.static_method()
を呼び出すだけで、JavaScriptが同じメソッドの追加の参照やコピーを保持する必要はありません。
これを読むこともできます JavaScript Override Patterns JavaScriptで継承を実装する方法をよりよく理解するために。
サンプルコードの後で、これを行うことができます。
for (var i in Class) {
SomeClass[i] = Class[i];
}
静的メンバーをClass
からSubClass
にコピーします。
JQueryを使用している場合は、 JavaScriptMVC の jQuery.Class プラグインをご覧ください。または、John Resigの Simple JavaScript Inheritance を拡張して、ライブラリに依存しないシステムにすることもできます。
ES5の場合、静的メソッドをBaseClassからSubClassにコピーするには、Object.assign
を使用する必要がありますが、ES6の場合、Object.assign
を使用しなくても機能するはずです。
var BaseClass = function(){
}
BaseClass.sayHi = function(){
console.log("Hi!");
}
var SubClass = function(){
}
Object.assign(SubClass , BaseClass);
BaseClass.sayHi(); //Hi
SubClass.sayHi(); //Hi
class BaseClass {
static sayHi(){
console.log("Hi!");
}
}
class SubClass extends BaseClass{
}
BaseClass.sayHi() //Hi
SubClass.sayHi() //Hi
「静的」メソッドをどのように実装していますか? JavaScriptにはネイティブのクラス/インスタンスオブジェクトモデルがないため、独自のクラスシステムをどのように設計したかによって異なります。
何かを継承できるようにする場合は、SomeClass
コンストラクター関数に直接何かを置くのではなく、SomeClass.prototype
オブジェクトを使用する必要があります。したがって、基本的には静的メソッドを通常のインスタンスメソッドとして定義しますが、this
のどの値がそれらに渡されるかを気にしないメソッドです。
static fields
経由でthis.constructor[staticField]
にアクセスできます。
class A {
static get Foo() { return 'Foo'; }
constructor() {
console.log(`Class ${this.constructor.name}`, this.constructor.Foo);
}
}
class B extends A {
static get Foo() { return 'Baz'; }
}
class C extends A {}
const a = new A();
const b = new B();
const c = new C()