web-dev-qa-db-ja.com

Typescript：名前付きパラメーターを渡すコンストラクターを介してクラスを作成しますか？

私はすべてオプションの3つのパラメーターで定義されたコンストラクターを持つクラスを持っています。名前のないパラメーターを渡すことができるようにしたいので、未定義で渡す必要はありません。

constructor(year?: number,
            month?: number,
            date?: number)

私はそのようにクラスのインスタンスを作成したいと思っていました

  const recurrenceRule = new MyNewClass(month: 6)

でもうまくいきませんでした

  const recurrenceRule = new MyNewClass(month = 6)

それはうまくいきませんでした。

私がそれを機能させた唯一の方法は、

  const recurrenceRule = new MyNewClass(undefined, 4)

または

  const recurrenceRule = new MyNewClass(, 4)

しかし、それはとても厄介なようです。名前付き引数を渡すことを望んでいたので、それらはすべてオプションであるため、単に1を渡すことができるはずです。

typescriptnamed-parameters
17
Martin

ES6で導入されたオブジェクトの構造化を使用して、目的の動作 reference を実現できます。 TypeScriptは、ES5で使用するためにこの機能を変換して、古いブラウザーをターゲットにすることができます。ただし、ES6の時点では、これも完全に有効なJavaScriptです。

基本的に、これはconstructor({ year, month, day})のように見え、たとえばnew Bar({ year: 2017 })として呼び出されます。次に、コンストラクタ内の変数としてyearにアクセスできます。 this.year = yearを割り当てるため。

それよりも興味深いのは、デフォルト値との使用です。

constructor({ year = new Date().getFullYear(), 
              month = new Date().getMonth(), 
              day = new Date().getDay()
            } = {})

これにより、それぞれ0、1、2、または3つのパラメーターでコンストラクターを呼び出すことができます（以下のスニペットを参照）。

やや不可解な= {}は、パラメーターなしで新しいインスタンスを作成する場合に使用します。最初に、{}がパラメーターオブジェクトのデフォルト値として使用されます。次に、yearが欠落しているため、その月のデフォルト値が追加され、次に月と日のデフォルト値が追加されます。

TypeScriptで使用する場合は、もちろん、追加の入力を追加できます。

constructor({ year = new Date().getFullYear(),
              month = new Date().getMonth(),
              day = new Date().getDay()
}: { year?: number, month?: number, day?: number } = {}) { 
    ...                
}

このreallyは不可解に見えますが。

class Bar {
  constructor({ year, month, day }) {
    this.year = year;
    this.month = month;
    this.day = day;
  }
  
  log () {
    console.log(`year: ${this.year}, month: ${this.month}, day: ${this.day}`);
  }
}

new Bar({ day: 2017 }).log();

class Foo {
  constructor({ year = new Date().getFullYear(), 
                month = new Date().getMonth(), 
                day = new Date().getDay()
              } = {}) {
    this.year = year;
    this.month = month;
    this.day = day;
  }
  
  log () {
    console.log(`year: ${this.year}, month: ${this.month}, day: ${this.day}`);
  }
}

console.log('with default value:');
new Foo().log();
new Foo({ day: 2 }).log();
new Foo({ day: 2, month: 8 }).log();
new Foo({ year: 2015 }).log();
28
SVSchmidt
class Bar {
  constructor({a, b}: {a?: number, b?: number}) {}
}

new Bar({b: 1})

詳細については、「 関数によるES6オブジェクトの構造化 」を参照してください。

2
elm

単純なパラメーター：

constructor (private recurrenceSettings: {year?: number, month?: number, date?: number})

Privateキーワードは、引数をインスタンス変数としてインスタンス化するため、コンストラクターでインスタンス化する必要がありません。パブリックプロパティをインスタンス化する場合は、publicにすることもできます。

次のように使用します。

const recurrenceRule = new MyClass({month: 12})

または、破壊を使用します（上記と同じ使用法）：

constructor({day, month, year}: {day?: number, month?: number, year?: number})

ただし、上記のバージョンでは、インスタンス変数にプライベート/パブリックショートカットを使用できません（ https://github.com/Microsoft/TypeScript/issues/5326 を参照）。

0
Paul Grimshaw