JavaScript基本【アロー関数】

前回の記事と同じ内容のものをアロー関数に書き換えます。

const hello = ()=>{
    console.log(`Hello,World!`);
}

hello();

const hello = (name)=>{
    console.log(`Hello,${name}!`);
}

hello('World');
hello('Japan');

const add = (num1,num2)=>{
    console.log(num1+num2);
}

add(2,6);
add(5,4);

const half = (num)=>{
    return num / 2;
}

const num = 20;
const result = half(num);
console.log(`${num}の半分は${result}です`);

const hello = ()=> console.log(`Hello,World!`);

hello();

中の処理が１行なので｛｝を省略できます

戻り値がある場合も、この行の結果がそのまま戻り値になるので、returnの記述も不要です。

const hello = name=> console.log(`Hello,${name}!`);
hello('World');
hello('Japan');

引数が１つの場合は引数のかっこ（）も省略できます

引数が２つ以上の場合は略さずにちゃんと（）で括ります。

アロー関数は便利に記述できる！ですが、

・もとの関数の仕組みを理解したうえで使用すること

・省略する場合は可読性を崩さないように意識する

のが大切だと思います。

const hello = ()=>{
    console.log(`Hello,World!`);
}

だけだとわかりにくいですが、

const hello = function(){
    console.log(`Hello,World!`);
}

のように、【変数に関数を代入している】という基本を意識して使用していきたいと思います！

SuzuBlog