ES6クラスインスタンスのプロパティとメソッドを使用してオブジェクトを拡張する方法

ディミトリス・カラギアニス

私は古いES5コードベースからいくつかのコードをリファクタリングしています。そこでは次のことを行っていました。

function ObjectCreatorFunction() {
  this.someProperty= {};
}

/*
 * Static method, to extend the object passed as a parameter with the
 * ObjectCreatorFunction instance properties and methods
 */
ObjectCreatorFunction.extend = function extend(object) {
  var key;

  ObjectCreatorFunction.call(object);
  for (key in ObjectCreatorFunction.prototype) {
    if (ObjectCreatorFunction.prototype.hasOwnProperty(key)) {
      if (!object.hasOwnProperty(key)) {
        object[key] = ObjectCreatorFunction.prototype[key];
      }
    }
  }

  return object;
};

ObjectCreatorFunction.prototype.someMethod = function someMethod() {...}
//etc

私はES6の書き換えで同じことをしようとしているので、これを持っています

class ClassName{
  constructor() {
    this.someProperty= {};
  }

  static extend(object) {
    let key;

    ClassName.constructor.call(object);
    for (key in ClassName.prototype) {
      if (ClassName.prototype.hasOwnProperty(key)) {
        if (!object.hasOwnProperty(key)) {
          object[key] = ClassName.prototype[key];
        }
      }
    }

    return object;
  }

  someMethod() {...}
  //etc
}

私の問題は、行ClassName.constructor.call(object);が意図したとおりに機能しないことです。つまり、渡されたオブジェクトがクラスのインスタンスプロパティを取得しません。

私はこれを(いくつかの非正統的なものでさえ)書き直して役に立たないようにするいくつかの方法を試みました。

ES6を使用して、クラスのインスタンスプロパティでオブジェクトを拡張するにはどうすればよいですか?

免責事項:

私のコードは、babelとwebpackを使用してトランスパイルプロセスを通過します。クラスが内部でどのように機能するかに影響がある場合。

ベルギ

いいえ、これはclass構文では機能しませんそれは単なる構文糖衣以上のものです。プロトタイプの継承は同じままでしたが、インスタンスの初期化は、特に継承されたクラスの場合、動作が異なるようになりnewました。新しいインスタンスを作成しないと、コンストラクターを呼び出すことはできません

私はあなたのミックスインについて明確にし、それにinit方法を与えることをお勧めします

class Mixin {
    constructor(methods) {
        this.descriptors = Object.getOwnPrpertyDescriptors(methods);
    }
    extend(object) {
        for (const p of this.descriptors)) {
            if (Object.prototype.hasOwnProperty.call(o, p)) {
                if (process.env.NODE_ENV !== 'production') {
                    console.warn(`Object already has property "${p}"`);
                }
            } else {
                Object.defineProperty(o, p, this.descriptors[p]);
            }
        }
    }
}

// define a mixin:
const xy = new Mixin({
    initXY() {
        this.someProperty= {};
    },
    someMethod() { … }
});
// and use it:
class ClassName {
    constructor() {
        this.initXY();
    }
}
xy.extend(ClassName.prototype);

この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。

侵害の場合は、連絡してください[email protected]

編集
0

コメントを追加

0

関連記事

分類Dev

DefaultValueを返すオブジェクトプロパティのカスタム拡張メソッド

分類Dev

JavaScript ES6プロキシを使用してオブジェクトメソッドをスパイする方法はありますか

分類Dev

プライベートコンストラクターを持ち、コンパニオンオブジェクト内でメソッドを使用してクラスをインスタンス化することの利点は何ですか?

分類Dev

mongoose.find()メソッドを使用してコンストラクターでjavascriptオブジェクトプロパティを設定します

分類Dev

ES6でクラスを使用してオブジェクトを拡張する方法は?

分類Dev

Spring-Boot WebMvcTest:認証オブジェクトパラメーターを使用してコントローラーメソッドをテストする方法

分類Dev

プロジェクト プロパティの VS デバッグ タブを使用してコマンド ライン パラメーターとしてシステム日付を取得する方法

分類Dev

PHP / OOP同じクラスのインスタンスが他のオブジェクトからプライベートプロパティ/メソッドにアクセスするのを回避する方法

分類Dev

ES6のプロパティの省略形を使用してオブジェクトをtypescriptで渡し、引数の前にインターフェイス名を付けないようにする簡単な方法は?

分類Dev

コンストラクター内のメソッドでItclオブジェクトを拡張する

分類Dev

オブジェクト型をパラメーターとして受け取るコンストラクターを使用した静的メソッドでの非静的クラス(コンテキスト)のインスタンス化

分類Dev

オブジェクトの反復を使用して拡張クラスの静的プロパティを読み取る/取得する方法

分類Dev

カスタムinitメソッドを使用してインスタンス化されたオブジェクトのプロパティにアクセスする

分類Dev

拡張クラスのメインクラスのメソッドを使用し、コンストラクターループを回避する方法

分類Dev

異なるメソッドとプロパティを持つ1つのインターフェイスからの異なるオブジェクト

分類Dev

オブジェクトインスタンスでコンストラクタのプライベートメソッドを使用する方法

分類Dev

リストオブジェクトのプロパティにExistsメソッドを使用する方法

分類Dev

ソースプロトタイプを拡張してメモリオブジェクトを作成する

分類Dev

reduceを使用して、ソースオブジェクトの列挙可能なプロパティを宛先オブジェクトに拡張します

分類Dev

リフレクションを使用してオブジェクトのプロパティのインスタンスを動的に取得する方法

分類Dev

オブジェクトを変更しようとしたときに、オブジェクトをオーバーライドしてプロパティをインスタンス化する方法はありますか?

分類Dev

拡張クラスをテストする場合の基本ES6クラスのJestモックメソッド(スーパーメソッド)

分類Dev

コンストラクター内の拡張プロパティをオーバーライドするTypescript

分類Dev

SecurityError:SeleniumPythonを使用してiframeのダウンロードリンクをクリックするとクロスオリジンオブジェクトエラーでプロパティ「ドキュメント」にアクセスするためのアクセス許可が拒否されました

分類Dev

Scalaのコンパニオンオブジェクトのapplyメソッドでクラスのサブタイプをインスタンス化する

分類Dev

プライベートメソッド/プロパティを使用してパブリックメソッド/プロパティの出力を変更する依存関係を持つAngular6サービスをテストする方法

分類Dev

式、静的メソッド、および基本オブジェクトを使用してクラスのプロパティ名を取得する

分類Dev

Javascriptオブジェクトリテラルテンプレート:ベースラインを使用して実装オブジェクトを拡張する

分類Dev

Typescript-ジェネリックスを使用して、共用体型のプロパティを持つインターフェイスを拡張します

Related 関連記事

  1. 1

    DefaultValueを返すオブジェクトプロパティのカスタム拡張メソッド

  2. 2

    JavaScript ES6プロキシを使用してオブジェクトメソッドをスパイする方法はありますか

  3. 3

    プライベートコンストラクターを持ち、コンパニオンオブジェクト内でメソッドを使用してクラスをインスタンス化することの利点は何ですか?

  4. 4

    mongoose.find()メソッドを使用してコンストラクターでjavascriptオブジェクトプロパティを設定します

  5. 5

    ES6でクラスを使用してオブジェクトを拡張する方法は?

  6. 6

    Spring-Boot WebMvcTest:認証オブジェクトパラメーターを使用してコントローラーメソッドをテストする方法

  7. 7

    プロジェクト プロパティの VS デバッグ タブを使用してコマンド ライン パラメーターとしてシステム日付を取得する方法

  8. 8

    PHP / OOP同じクラスのインスタンスが他のオブジェクトからプライベートプロパティ/メソッドにアクセスするのを回避する方法

  9. 9

    ES6のプロパティの省略形を使用してオブジェクトをtypescriptで渡し、引数の前にインターフェイス名を付けないようにする簡単な方法は?

  10. 10

    コンストラクター内のメソッドでItclオブジェクトを拡張する

  11. 11

    オブジェクト型をパラメーターとして受け取るコンストラクターを使用した静的メソッドでの非静的クラス(コンテキスト)のインスタンス化

  12. 12

    オブジェクトの反復を使用して拡張クラスの静的プロパティを読み取る/取得する方法

  13. 13

    カスタムinitメソッドを使用してインスタンス化されたオブジェクトのプロパティにアクセスする

  14. 14

    拡張クラスのメインクラスのメソッドを使用し、コンストラクターループを回避する方法

  15. 15

    異なるメソッドとプロパティを持つ1つのインターフェイスからの異なるオブジェクト

  16. 16

    オブジェクトインスタンスでコンストラクタのプライベートメソッドを使用する方法

  17. 17

    リストオブジェクトのプロパティにExistsメソッドを使用する方法

  18. 18

    ソースプロトタイプを拡張してメモリオブジェクトを作成する

  19. 19

    reduceを使用して、ソースオブジェクトの列挙可能なプロパティを宛先オブジェクトに拡張します

  20. 20

    リフレクションを使用してオブジェクトのプロパティのインスタンスを動的に取得する方法

  21. 21

    オブジェクトを変更しようとしたときに、オブジェクトをオーバーライドしてプロパティをインスタンス化する方法はありますか?

  22. 22

    拡張クラスをテストする場合の基本ES6クラスのJestモックメソッド(スーパーメソッド)

  23. 23

    コンストラクター内の拡張プロパティをオーバーライドするTypescript

  24. 24

    SecurityError:SeleniumPythonを使用してiframeのダウンロードリンクをクリックするとクロスオリジンオブジェクトエラーでプロパティ「ドキュメント」にアクセスするためのアクセス許可が拒否されました

  25. 25

    Scalaのコンパニオンオブジェクトのapplyメソッドでクラスのサブタイプをインスタンス化する

  26. 26

    プライベートメソッド/プロパティを使用してパブリックメソッド/プロパティの出力を変更する依存関係を持つAngular6サービスをテストする方法

  27. 27

    式、静的メソッド、および基本オブジェクトを使用してクラスのプロパティ名を取得する

  28. 28

    Javascriptオブジェクトリテラルテンプレート:ベースラインを使用して実装オブジェクトを拡張する

  29. 29

    Typescript-ジェネリックスを使用して、共用体型のプロパティを持つインターフェイスを拡張します

ホットタグ

アーカイブ