JavaScriptでデータの繰り返し処理を行う際、これまではfor文を使うのが一般的でした。しかし、for文は書き方が少し複雑で、変数の管理に気を配る必要がありました。そこで初心者の方にぜひ覚えてほしいのが、for…of文です。
for…of文がなぜおすすめなのか
従来のfor文では、インデックス番号（iなど）を使って配列の要素にアクセスしていました。しかし、for…of文を使えば、配列の中身を直接取り出すことができます。これにより、コードが直感的になり、記述ミスも減らすことができます。
具体的な書き方の比較
例えば、果物の名前が入ったリストから、順番に名前を表示するプログラムを考えてみましょう。
従来のfor文の場合：
for (let i = 0; i < fruits.length; i++) {
console.log(fruits[i]);
}
for...of文の場合：
for (const fruit of fruits) {
console.log(fruit);
}
見ての通り、for...of文の方が「配列の中のフルーツを一つずつ取り出す」という意図が明確に伝わりますよね。
注意すべき「const」と「let」の使い分け
for…ofのループ内で、中身の値を別の値に書き換える必要がない場合は、必ずconstを使いましょう。これにより、意図しない値の書き換えを防ぎ、コードの安全性が高まります。もしループ内で値を更新したい場合だけ、letを使用するように心がけてください。
どんな時に使うのがベストか
for…of文は、配列のような「順番があるデータ」を扱う時に最強のツールです。また、文字列に対しても使うことができ、一文字ずつ処理することも可能です。
まずは、これまで書いていたfor文をひとつ、for…of文に書き換えてみてください。その圧倒的なシンプルさに、きっと驚くはずですよ。まずは小さな一歩から、モダンなJavaScriptの書き方を身につけていきましょう。