JavaScriptの配列をわかりやすく解説！初心者向け基本の使い方と操作方法
新人
「JavaScriptでデータをたくさん管理したいときはどうすればいいですか？」
先輩
「JavaScriptには配列という便利な機能があります。複数のデータをひとつのまとまりとして管理できるんです。一緒に基本の使い方から見ていきましょう！」
1. 配列とは？
JavaScriptの配列とは、複数のデータをひとつの箱にまとめて保存できる仕組みです。たとえば、果物の名前や点数などのデータをまとめて管理したい場合に便利です。
配列を使うと、データを一つずつ変数に分ける必要がなく、まとめて処理することができます。
2. JavaScriptで配列を記述する方法
配列は角かっこ[]を使って記述し、中にデータをコンマ,で区切って並べます。次の例では、3つの果物の名前を配列に入れています。
<script>
let fruits = ["りんご", "みかん", "バナナ"];
document.write("配列の中身: " + fruits + "<br>");
</script>
このプログラムでは、変数fruitsに3つの果物の名前を配列として格納し、その中身をdocument.writeで表示しています。
3. インデックスとは？
配列の中の各データには、インデックス（番号）が自動的に割り振られています。JavaScriptの配列は0から始まるため、最初のデータには0というインデックスが付きます。
fruits[0]: 「りんご」fruits[1]: 「みかん」fruits[2]: 「バナナ」
次に、インデックスを使って特定のデータを取り出して表示する方法を見てみましょう。
<script>
let fruits = ["りんご", "みかん", "バナナ"];
document.write("最初の果物: " + fruits[0] + "<br>");
document.write("次の果物: " + fruits[1] + "<br>");
document.write("最後の果物: " + fruits[2] + "<br>");
</script>
このプログラムでは、インデックス0、1、2を使ってそれぞれの果物の名前を画面に表示しています。
4. 特定の箱に新しいデータを代入する
配列の中の特定のインデックスに新しいデータを代入することもできます。次の例では、fruits[1]の「みかん」を「いちご」に変更しています。
<script>
let fruits = ["りんご", "みかん", "バナナ"];
fruits[1] = "いちご";
document.write("変更後の配列: " + fruits + "<br>");
</script>
実行すると、配列の中身が「りんご」、「いちご」、「バナナ」に変更されることが確認できます。
5. 配列の長さを調べる（lengthプロパティ）
配列に入っているデータの数を調べるには、lengthプロパティを使います。次の例では、配列の要素の数を表示しています。
<script>
let fruits = ["りんご", "みかん", "バナナ"];
document.write("配列の長さ: " + fruits.length + "<br>");
</script>
このプログラムでは、配列に3つの要素が入っているため、3と表示されます。配列の長さを知ることで、ループ処理やデータ操作が効率的に行えます。
6. 配列の活用例
配列はリストを扱うときに非常に便利です。たとえば、複数の名前、商品のリスト、数値の集まりなど、さまざまな場面で使うことができます。配列をしっかり理解すれば、JavaScriptで効率よくデータを管理する力が身につきます。
