Zenn
🏹

【JavaScript】アロー関数

に公開
JavaScript
tech

初めに

JavaScriptにおけるアロー関数について、まとめていきたいと思います！

JavaScript

基本的な構文

const 関数名 = (引数1, 引数2, ...) => 戻り値;
  • () 内に引数を指定する（引数が1つなら () 省略可能）。
  • => の右側に関数の処理を書く（1行なら {} や return を省略できる）。
  • {} を使う場合は return を明示する。

基本的な使い方

const add = (a, b) => a + b;
console.log(add(2, 3));

実行結果
5

{} を使う場合

const multiply = (a, b) => {
    const result = a * b;
    return result;
};
console.log(multiply(2, 3));

実行結果
6

  • {} を使う場合は return を明示する必要がある。

引数が1つの場合

const square = x => x * x;
console.log(square(4));

実行結果
16

  • 引数が1つなら () 省略可

引数がない場合

const sayHello = () => console.log("Hello!");
sayHello();

実行結果
Hello!

デフォルト値を設定

const greet = (name = "Guest") => `Hello, ${name}!`;
console.log(greet());      
console.log(greet("Alice"))

実行結果
Hello, Guest!
Hello, Alice!

Discussion