JavaScript | 基礎構文：関数 – アロー関数

JavaScript

2025.12.14

アロー関数とは何か

アロー関数とは、JavaScript で関数をより短く書ける新しい記法です。=>（矢印）を使うので「アロー関数」と呼ばれます。通常の関数宣言や関数式よりもシンプルに書けるため、初心者でも読みやすく、モダンなコードでよく使われます。

アロー関数は次のように書きます。

const 関数名 = (引数) => {
  // 実行したい処理
  return 戻り値;
};

const 関数名 = (引数) => {
  // 実行したい処理
  return 戻り値;
};

JavaScript

const add = (a, b) => {
  return a + b;
};

console.log(add(3, 5));  // 8

const add = (a, b) => {
  return a + b;
};

console.log(add(3, 5));  // 8

JavaScript

通常の関数式より短く書けます。

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

console.log(add(10, 20)); // 30

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

console.log(add(10, 20)); // 30

JavaScript

処理が1行だけなら {} と return を省略できます。

const greet = name => `こんにちは、${name}さん`;

console.log(greet("太郎")); // こんにちは、太郎さん

const greet = name => `こんにちは、${name}さん`;

console.log(greet("太郎")); // こんにちは、太郎さん

JavaScript

引数が1つなら () を省略できます。

const sayHello = () => "こんにちは";

console.log(sayHello()); // こんにちは

const sayHello = () => "こんにちは";

console.log(sayHello()); // こんにちは

JavaScript

引数がない場合は () を空にして書きます。

従来の function よりもシンプルで、読みやすいコードになります。

アロー関数は「自分自身の this を持たない」ため、オブジェクトのメソッドには向いていません。イベント処理やコールバック関数では便利ですが、this を使う場面では注意が必要です。

初心者は「アロー関数は関数を短く書くための便利な書き方」と覚えると理解しやすいです。