Java経験者向け:JavaScriptのアロー関数をやさしく解説!
こんにちは。ゆうせいです。
今回は「Javaを学んだ新人エンジニア」に向けて、JavaScriptのアロー関数(Arrow Function)をていねいに解説していきます。
「Javaにはない記法で戸惑う…」
「なにこれ、lambda式と似てる?」
そんな疑問を持ったことはありませんか?
Java経験者だからこそわかりやすくなるように、Javaとの比較や具体的なコード例を交えながら説明しますね!
アロー関数とは?〜Javaのラムダ式と何が違う?〜
まず、アロー関数とはJavaScriptで関数を簡潔に書くための記法です。
Javaでいうところの「ラムダ式(lambda expression)」にとてもよく似ています。
Javaでのラムダ式
(x) -> x * x;
JavaScriptでのアロー関数
(x) => x * x;
そっくりですよね?
ただし、中身の仕組みや扱いにはいくつか大きな違いがあります。順を追って解説していきます!
書き方のパターン
H3: 引数が1つだけの場合
x => x * x;
カッコも波カッコもreturnも不要です!
H3: 引数が0個または複数の場合
() => console.log("Hello!");
(a, b) => a + b;
複数あるときは、引数を必ず ()
で囲います。
H3: 処理が複数行の場合(ブロック構文)
(x, y) => {
const sum = x + y;
return sum;
}
波カッコ {}
を使った場合は、明示的に return を書かないと値は返りません。
なぜ使うの?メリットと注意点
H3: メリット① 記述量が減る
JavaScriptは「関数」を頻繁に使う言語です。
そのたびに function キーワードを書いていたら、コードが冗長になります。
// 従来の書き方
const square = function(x) {
return x * x;
}
// アロー関数
const square = x => x * x;
一目瞭然ですね!
H3: メリット② thisが束縛される(Java経験者には注意点)
ここが最大の違いであり、最大の混乱ポイントです。
アロー関数では this が自動的に外側のスコープを参照します。
Javaのラムダ式ではthisはインスタンスを指しますが、JavaScriptでは文脈に応じて変わるのです。
例:setTimeoutでのthisの違い
// function版
function Timer() {
this.seconds = 0;
setInterval(function() {
this.seconds++;
console.log(this.seconds);
}, 1000);
}
// アロー関数版
function Timer() {
this.seconds = 0;
setInterval(() => {
this.seconds++;
console.log(this.seconds);
}, 1000);
}
上の function 版は this.seconds
が undefined
に。
アロー関数にすると this
が Timer オブジェクトを正しく指します。
アロー関数が使えない・避けるべきケース
アロー関数は便利ですが、以下のような場合には使わない方が安全です。
ケース | 理由 |
---|---|
オブジェクトのメソッド | this の参照が意図とずれる可能性 |
コンストラクタ関数 | new を使えない(エラーになる) |
高度な継承処理・イベントバインド | this の動的な参照が重要な場合 |
図でまとめて比較
特徴 | アロー関数 | 通常のfunction式 |
---|---|---|
記述の簡潔さ | ◎ 非常に簡潔 | △ 長くなる |
this の扱い | 外側のスコープを参照 | 呼び出し元に依存 |
コンストラクタ使用 | × 不可 | ○ 可能 |
メソッドとしての利用 | △ 非推奨 | ○ 適切 |
まとめと次のステップ
アロー関数はJavaのラムダ式と似て非なるものです。
シンプルに書けるのが最大の魅力ですが、thisの扱いが特殊なので注意が必要です。
今後の学習ポイント
- thisの挙動を自分でいくつか書いて確かめる
- functionとアロー関数を使い分ける設計を意識する
- 他の高階関数(map, filter, reduceなど)と組み合わせて使う
「JavaScriptって自由すぎて逆に難しい…」
そんなときこそ、基本に立ち返って「なぜその書き方をするのか」を意識しましょう!
気になった点があれば、いつでも質問してくださいね。次は「高階関数」について一緒に見ていきましょう!
セイ・コンサルティング・グループの新人エンジニア研修のメニューへのリンク
投稿者プロフィール
