web-dev-qa-db-ja.com

JavaScript ECMA6でコンストラクターをオーバーロードする方法は？

目的

JavaScript ECMA6でコンストラクターのオーバーロードを許可するメカニズムを実装する

これが重複していない理由

トピック JavaScript ES6がマルチコンストラクタクラスをサポートしないのはなぜですか？ ですが、類似点はこれと同じではありません。他のトピックでは、oldECMAScriptバージョンを使用したオーバーロードコンストラクターにのみ焦点を当てていますが、このトピックではECMA6に焦点を当てています。更新された答えを探しているなら、ここが最適です。

バックグラウンド

特定のコンストラクターを持つJavaScriptクラスがあり、ユーザーがオブジェクトをインスタンス化するときにさまざまなコンストラクターを持つことができるようにしたいと思います。私がふりをする例は次のようになります：

const DEFAULT_WHEEL_NUMBER = 4;
const DEFAULT_COLOR = "black";    
const DEFAULT_NAME = "myCar";

class Car{

    constructor(numberWheels, aName, aColor){
        this.wheelsNum = numberWheels;
        this.name = aName;
        this.color = aColor;
    }

    constructor(aName){
        this(DEFUALT_WHEEL_NUMBER, aName, DEFAULT_COLOR);
    }

    constructor(){
        this(DEFUALT_WHEEL_NUMBER, DEFAULT_NAME, DEFAULT_COLOR);
    }
}

このコードでは、ユーザーが使用できる3つのコンストラクターがあり、それぞれが異なる量のパラメーターを取ります。使用例は次のとおりです。

var car1 = new Car(3, "tricicle-car", "white");
var car2 = new Car("Opel"); //creates black car with 4 wheels called Opel
var car3 = new Car(); //creates a black car, with 4 wheels called myCar

問題

JavaまたはC＃を使用している場合、これらの言語にはコンストラクタオーバーロードがあるため、これは簡単な例です。

しかし、 MDNのクラスに関するドキュメント から、JavaScriptはそうではないと結論付けることができます。

質問

  1. ECMA6を使用してJavaScriptクラスに同様のメカニズムを実装する方法はありますか？そうでない場合、最良/最も近い代替手段は何ですか？
javascriptconstructorecmascript-6overloadingconstructor-overloading
14
Flame_Phoenix

JavaScriptには、このための組み込みソリューションはありません。別の解決策として、argumentsオブジェクトを使用するか（場合によっては）、次のような独自の構成オプションを渡すことができます。

const defaults = {
    numberWheels: 4,
    color: "black",   
    name: "myCar"
}

class Car {
    constructor(options) {
         this.wheelsNum = options.numberWheels || defaults.numberWheels;
         this.name = options.name || defaults.name;
         this.color = options.color || defaults.color;
    }
}

これは基本的には古い学校のソリューションです。ES3でも同じロジックを使用しています。

9
meskobalazs

これは、私が知る限り、JavaScriptクラスがサポートする機能ではないことは正しいです。ここでの推奨事項は、すでにES6の機能を使用しているため、代わりに default parameters を使用することです。

class Car {
    constructor(numberWheels = 4, aName = "myCar", aColor = "black"){
        this.wheelsNum = numberWheels;
        this.name = aName;
        this.color = aColor;
    }
}

これには、例のように異なるパラメーターの順序で「オーバーロード」することはできないという警告が明らかに付いています（私の意見では、これは良いことです-一貫したAPIを使用する方がはるかに優れています）。

meskobalazsの回答も良いオプションです。特に、オブジェクトに取り入れたいオプションがたくさんある場合は、このようにします。このような関数のパラメーターを使用すると、少し面倒になります。

10
Joe Clay