JavaScriptでメソッド呼び出しを連鎖させる

JavaScriptでは、次のようにメソッド呼び出しをチェーンできる場合があります。

car.start().drive()

そうすることは非常に便利です。

書く代わりに

car.start()
car.drive()

ワンライナーで簡素化できます。

これは、各メソッドがオブジェクト自体を返す場合に可能です。つまり、実装は次のようになっている必要があります。

const car = {
  start: function() {
    console.log('start')
    return this
  },
  drive: function() {
    console.log('drive')
    return this
  }
}

矢印関数は使用できないことに注意してください。thisオブジェクトメソッドとして使用される矢印関数では、オブジェクトインスタンスにバインドされていません。

私はいつも矢印関数を使うのが好きですが、これはあなたができないケースの1つです。

連鎖メソッド呼び出しは、メソッドから値のセットを返さない場合に最適です。そうでない場合は、明らかにメソッド呼び出しを変数に割り当てる必要があり、連鎖は不可能です。

const result = car.start()
if (result) {
  car.drive()
}

私の無料ダウンロードJavaScriptビギナーズハンドブック


その他のjsチュートリアル: