【React】アロー関数のいろんな書き方　return、( )の省略

2022.03.262021.11.29

constのアロー関数の中身いろんな書き方ない？って思った方はいませんか？

私は思いました。何が正解なのかパニックです。

そこで、アロー関数の書き方について、超基本ですが、整理のためにまとめました。

alertを表示する例でわかりやすくしています。

以下は3種類の異なる書き方ですが全て同じ挙動になります。

アロー関数の3つの基本形

  const test = () => {
    return (
      alert()
    )
  }

アロー関数内の処理が1行のときはreturnと波括弧{ }を省略することができます。

  const test = () => 
    (
      alert()
    )

const test = () => alert()

補足として、functionを使って書くと以下のようになります。

function test() {
  return alert()
}

引数が1個の場合は、引数の括弧( )を省略することもできます。

引数をaとした場合

const test = a => alert(a)

超基本ですがこんなまとめ記事もあっていいんじゃないでしょうか。

以上、ご覧いただきありがとうございました。