JavaScriptの矢印「=>」アロー関数

こんにちは、さるまりんです。

JavaScriptのアロー関数について覚えておくためにここにメモします。

JavaScriptの関数定義ってこんな感じです。

function greeting() {
    document.write("Hello");
}

または、こんな感じです。

const greeting = function() {
    document.write("Hello");
}

どちらも呼び出す時はこうです。

greeting();

これを簡単に記述するための仕組みがアロー関数です。
アロー、「矢印」(=>)を使って記述します。

const greeting = () => {
    document.write("Hello");
}

キーワードfunctionではなく引数の()の後に=>にします。

もらった数字nが偶数か奇数かをチェックするisEven()

const isEven = function (n) {
    return n % 2 === 0 ? "even" : "odd";
}

なら

const isEven = (n) => (n % 2 === 0 ? "even" : "odd");

上のisEvenは引数が一つです。
この場合、引数の()を省略して書くこともできます。

const isEven = n => (n % 2 === 0 ? "even" : "odd");

引数がない場合(上のgreetingのように)は()は必須です。

引数が複数の場合はこんな感じです。
addはもらった数字abを足してくれます

const add = (a, b) => (a + b);

functionで記述するのも良いのですが、シンプルな構造のものであれば=>を使った方が簡潔にかけることもあるかな。適材適所、良いコードを書いていきたいです。

読んでくださってありがとうございました。

それではまた!