はじめに
ReactでES2015を使ってJSを書いていると、Arrow Functionがよく出てきます。
前回の記事ではArrow Functionにおけるthisの挙動について整理しましたが、今回はArrow Function自体について整理します。
読んだもの
関数式とはなにか
関数式とは、関数を値として変数へ代入している式のことです。
関数式を使う場合、関数の名前は省略することができます。
このような名前を持たない関数を匿名関数（または無名関数）と呼びます。
シンプルな関数式
無名関数を使ったシンプルな例です。
const 変数名 = function() {
return hoge;
};
関数式では引数を使うこともできます。
const 変数名 = function(n, m) {
return n + m;
};
Arrow Functionを使った関数式
Arrow Functionは関数式の書き方のひとつです。
const 変数名 = () => {
return hoge;
};
Arrow Functionを使う場合、関数の処理が一つの式であれば、returnは省略できます。
const 変数名 = (n, m) => {
n + m;
};
また、引数が一つであれば ()を省略できます。
const 変数名 = n => {
return n;
};
おわりに
他にも、Arrow Functionを使った関数式には次のような特徴があります。
- 関数に名前を付けることができないので、常に匿名関数である
- thisを静的に決定する (前回の記事で詳しく書きました)
省略形を使うことができ、thisの値を静的に決定することができるArrow Functionにはメリットが多く、メソッドでない関数式を扱う場合は、優先して利用することが推奨されています。
