web-dev-qa-db-ja.com

JavaScriptの基本クラスから静的メソッドを継承する方法は?

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();

ただし、SubClassClassからstatic_methodを継承しません。

28
William Choi

これを試して:

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();

このペン でこれをライブで実際に見ることができます。

楽しい!

7
donavon

古典的な(OO)継承パターンでは、静的メソッドは実際には継承されません。したがって、静的メソッドがある場合は、必要なときにいつでもSuperClass.static_method()を呼び出すだけで、JavaScriptが同じメソッドの追加の参照やコピーを保持する必要はありません。

これを読むこともできます JavaScript Override Patterns JavaScriptで継承を実装する方法をよりよく理解するために。

16
DragonDTG

サンプルコードの後で、これを行うことができます。

for (var i in Class) {
    SomeClass[i] = Class[i];
}

静的メンバーをClassからSubClassにコピーします。

JQueryを使用している場合は、 JavaScriptMVCjQuery.Class プラグインをご覧ください。または、John Resigの Simple JavaScript Inheritance を拡張して、ライブラリに依存しないシステムにすることもできます。

9
Jeffery To

ES5の場合、静的メソッドをBaseClassからSubClassにコピーするには、Object.assignを使用する必要がありますが、ES6の場合、Object.assignを使用しなくても機能するはずです。

ES5の例

var BaseClass = function(){

}

BaseClass.sayHi = function(){
   console.log("Hi!");
}

var SubClass = function(){

}

Object.assign(SubClass , BaseClass);

BaseClass.sayHi();   //Hi
SubClass.sayHi(); //Hi

ES6の例

class BaseClass {
   static sayHi(){
     console.log("Hi!");
   }
}

class SubClass extends BaseClass{

}

BaseClass.sayHi()   //Hi
SubClass.sayHi() //Hi
7
Amr Labib

「静的」メソッドをどのように実装していますか? JavaScriptにはネイティブのクラス/インスタンスオブジェクトモデルがないため、独自のクラスシステムをどのように設計したかによって異なります。

何かを継承できるようにする場合は、SomeClassコンストラクター関数に直接何かを置くのではなく、SomeClass.prototypeオブジェクトを使用する必要があります。したがって、基本的には静的メソッドを通常のインスタンスメソッドとして定義しますが、thisのどの値がそれらに渡されるかを気にしないメソッドです。

1
bobince

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()
0
Hitmands