配列
初級読み方:はいれつ|英語:Array
複数のデータをまとめて管理するデータ構造で、["A", "B", "C"] の形で書くよ。
やさしい説明
配列(はいれつ)とは、複数のデータを順番に並べて管理するデータ構造です。「番号付きのロッカー」のイメージです。
[ ] で囲んでカンマで区切って書きます。番号(インデックス)は0から始まるのが特徴です。最初の要素は [0] です。
同じ種類のデータをまとめて管理するのに向いています。生徒の名前一覧、テストの点数一覧、商品リストなどに使います。
図解:配列とオブジェクトの違い
具体例・使い方
const fruits = ["りんご", "みかん", "バナナ"];
fruits[0]; // "りんご"(最初の要素)
fruits.length; // 3(要素数)
fruits.push("ぶどう"); // 末尾に追加
// 全要素に対して処理
fruits.forEach(fruit => {
console.log(fruit);
}); よく使うメソッド
| メソッド | 何をする? |
|---|---|
push() | 末尾に要素を追加する |
pop() | 末尾の要素を取り除く |
forEach() | 全要素を1つずつ処理する |
map() | 全要素を変換して新しい配列を作る |
filter() | 条件に合う要素だけ残す |
includes() | その要素が含まれるか調べる(true/false) |
いつ使う?
- 同じ種類のデータを複数まとめたいとき(生徒名・点数・商品リスト)
- TODOリストやチャットのメッセージ一覧
- 検索結果やAPIから返ってきたデータの表示
- ループで「全部に同じ処理」をしたいとき
配列と map() は相性抜群。fruits.map(f => "<li>" + f + "</li>") のように書けば、データ一覧からHTMLを自動生成できます。ToDoアプリや一覧表示の基本パターンです。
間違いやすいポイント
❌ インデックスが0から始まることを忘れる
最初の要素は [0]。「2番目」は [1] です。存在しない番号にアクセスすると undefined が返ります。
const arr = ["A", "B", "C"];
arr[1]; // "B"(2番目!1番目ではない)
arr[3]; // undefined(存在しない) ❌ = で配列をコピーしたつもりが「同じ配列」を指す
const b = a; は中身を複製せず、同じ配列を共有します。b を変えると a も変わります。複製したいときは const b = [...a];(スプレッド構文)を使いましょう。
よくある疑問
Q: 配列のインデックスはなぜ0から?
A: コンピューターの内部的な理由です。最初の要素は[0]、2番目は[1]と覚えましょう。arr.lengthは要素数なので、最後のインデックスはlength-1です。
Q: 配列に要素を追加するには?
A: arr.push(値) で末尾に追加、arr.unshift(値) で先頭に追加します。pushが最もよく使います。
Q: 配列の要素数を調べるには?
A: arr.length で要素数がわかります。空の配列は length が 0 です。
関連用語
📖 関連レッスン
レッスンを見る →