【JavaScript】アロー関数式について

今回は便利なのについ使用することを忘れてしまう
JavaScriptの「アロー関数式」を備忘録的な形で紹介します。

アロー関数式

アロー関数式はES6から使用できるようになった構文です。
従来の関数式を簡略化して使用することができます。

使用方法

とても簡略化されていますね。

アロー関数の特徴

ただし引数が複数の場合は()が必須となります。

ちなみに上記関数の従来の記述はこうです。

アロー関数を使用するメリット

①については前述の説明で理解できたかと思います。

②については理解が難しいところなので、私自身も勉強しなおしつつ説明を書いていこうと思います。

そもそも、JavaScriptのthisとは何なのでしょうか？

とても簡単に説明すると、thisは『呼び出した場所や方法によって中身が変わる変数』です。
なので、thisが何なのかはその都度変わります。
（今回はアロー関数とそれ以外の関数（メソッド含む※）でのthisの話をします）

※メソッドは関数を値に持つプロパティ

⇒関数定義時に決める事ができる

⇒関数を実行するときに決まる

アロー関数以外のthisの「関数を実行するときに決まる」は若干問題があり、
実行した時にthisが決まるので予期せぬ挙動を返すこともあります。
（ただしこれが必要な場合もあります）

アロー関数は「関数定義時に決める事ができる」ので、実行するまでthisが何かわからない問題を回避できます。

アロー関数がどのthisを参照するかは

これなら関数実行時に決まるよりも、thisの中身が想像しやすいですね◎

アロー関数が便利な理由と使いどころ

関数とスコープ

JavaScript、アロー関数のthisについて。