JavaScriptミックスインの使用

投稿日: 2022-04-20 2022-10-06
タグ: javascript

高度なクラス構成に関しては、JavaScriptにはかなりの数のアプローチがあります-オプションの真のスモーガスボードです。野生ではめったに見られないタイプのパターンは、ミックスインベースの継承パターンです。ミックスインは通常、新しいJavaScriptプログラマーによってスキップされます（私もそうしました）。私は文句を言いたくありませんが、ミックスインは時々、書いたり理解したりするのに非常に密集していることがあります。ただし、調査する価値のある機能が多数用意されています。

ミックスインパターンは、その名前が示すように、オブジェクトを他のオブジェクトと混合して、必要なプロパティを追加するパターンです。オブジェクトに追加のプロパティを与えることができるアドオンのように考えてください。ただし、これらの個々のプロパティは、実際にはそれ自体がサブクラスではありません。

表面上、ミックスインはオブジェクトミキシングレイヤーのように動作し、ターゲット（ミックスイン）とソースを渡します。ターゲットがソースに追加され、新しいオブジェクトが返されます。

より正確な説明は、ミックスインが新しいサブクラスオブジェクトが返されるファクトリとして機能することです。このプロセス全体を通して、サブクラスの定義はどこにもありません。

より多くのC++のアナロジーは、それらを仮想関数を持つ抽象クラスと比較して、他のサブクラスに継承できるようにすることです。

したがって、ミックスインを使用すると、既存のスーパークラスに適用して新しいサブクラスを作成できる変更された定義を作成できることがわかったので、ミックスインがどのようになるかを見てみましょう。

//The swim property here is the mixin
let swim = {
  location() {
    console.log(`Heading ${this.direction} at ${this.speed}`);
  }
};

let Alligator = function(speed, direction) {
  this.speed = speed,
  this.direction = direction
};

//This is our source object
let alligator = new Alligator('20 mph','North');

alligator = Object.assign(alligator, swim);
console.log(alligator.location());

上記のスニペットでは、泳げるワニを作成します。だから私たちは新しいを作成します alligator そしてそれに与える swim 特徴。 The swim オブジェクトは、必要なミックスインまたは拡張機能です。 alligator Object.assignメソッドを使用するオブジェクト。

The Object.assign メソッドを使用すると、一度に複数のミックスインを追加できます。複数のミックスインの場合は次のようになります。

alligator = Object.assign(alligator, swim, crawl);

次に、ES6クラスでミックスインを使用する方法を見てみましょう。

let swim = {
 setSwimProperties(speed, direction) {
   this.speed = speed;
   this.direction = direction;
 },

 getSwimProperties(){
   console.log(`swimming ${this.speed} towards ${this.direction}`);
 }
}

class Reptile {
 constructor(name) {
   this.name = name;
 }
}

Object.assign(Reptile.prototype, swim);
let alligator = new Reptile("alligator");
alligator.setSwimProperties("5 m/s", "upstream");
alligator.getSwimProperties();

ミックスインアプローチを介して機能を追加する利点は、柔軟性です。ミックスインは非常に原始的な関数であり、まさに1つのことを実行するため、これらの構造を繰り返し、さまざまなシナリオで使用できます。ネイティブ関数呼び出しで使用したり、クラス定義などで使用したりできます。

もう1つの良い点は、クラス階層を水平に保つ傾向があることです。これらの場合に新しいサブレーザーを作成するために継承チェーンを長くするのではなく、スーパークラスがミックスインを使用して目的のサブクラスプロパティの新しいオブジェクトを作成できるようにします。

ただし、ミックスインを使用する際に留意すべき点がいくつかあります。

The Object.assign （オブジェクトとクラスの両方の実装で）ミックスインプロパティの浅いコピーのみを実行します。
異なるミックスインのプロパティを使用しているときに名前が衝突する可能性があります（多重継承の菱形継承問題）
プロパティはソースオブジェクトにコピーされるため、プロパティがどのミックスインから来たのかを把握するのは非常に難しい場合があります。演算子のインスタンスはここでは役に立ちません。

getdocs

13036