JavaScriptの配列：複数の値をまとめて管理する

繰り返し処理に続いて、「配列」を学びました。配列は、複数のデータを1つの変数にまとめて管理できるデータ構造です。Pythonのリストに相当します。

配列とは

配列は、複数の値をまとめて管理するデータ型です。

構文: ["値1", "値2", ...]

const fruits = ["りんご", "バナナ", "オレンジ"];
console.log(fruits);
// ["りんご", "バナナ", "オレンジ"]

角括弧 [] で囲み、要素をカンマ , で区切ります。

配列のインデックス番号

配列の各要素には「インデックス番号」が割り振られており、0から始まります。

const fruits = ["りんご", "バナナ", "オレンジ"];

console.log(fruits[0]);  // りんご（0番目の要素）
console.log(fruits[1]);  // バナナ（1番目の要素）
console.log(fruits[2]);  // オレンジ（2番目の要素）

インデックス番号の仕組み

インデックス012
値りんごバナナオレンジ

インデックスは1からではなく、0から始まる点に注意です。

配列の要素を更新する

配列の要素は、後から変更できます。

const fruits = ["りんご", "バナナ", "オレンジ"];

fruits[1] = "ぶどう";  // 1番目の要素を変更

console.log(fruits);
// ["りんご", "ぶどう", "オレンジ"]

インデックスを指定して、新しい値を代入するだけで更新できます。

配列とfor文の組み合わせ

配列の真価は、for文と組み合わせたときに発揮されます。

const fruits = ["りんご", "バナナ", "オレンジ"];

for (let i = 0; i < 3; i++) {
  console.log(fruits[i]);
}
// りんご
// バナナ
// オレンジ

インデックス i を使うことで、配列の全要素を順番に処理できます。

length：配列の要素数を取得

length プロパティを使うと、配列の要素数を取得できます。

構文: 配列.length

const fruits = ["りんご", "バナナ", "オレンジ"];

console.log(fruits.length);  // 3

lengthを使った動的なfor文

length を使うことで、配列の要素数が変わってもfor文を書き直す必要がなくなります。

const fruits = ["りんご", "バナナ", "オレンジ", "メロン", "いちご"];

// 要素数に関係なく、全要素を処理できる
for (let i = 0; i < fruits.length; i++) {
  console.log(fruits[i]);
}

i < fruits.length とすることで、配列の長さに応じて自動的にループ回数が調整されます。

具体例：合計を計算

const numbers = [10, 20, 30, 40];
let sum = 0;

for (let i = 0; i < numbers.length; i++) {
  sum += numbers[i];
}

console.log(`合計: ${sum}`);
// 合計: 100

配列を使うメリット

1. データをまとめて管理できる

// ❌ 変数を個別に管理（非効率）
const fruit1 = "りんご";
const fruit2 = "バナナ";
const fruit3 = "オレンジ";

// ✅ 配列でまとめて管理（効率的）
const fruits = ["りんご", "バナナ", "オレンジ"];

2. 繰り返し処理と相性が良い

const fruits = ["りんご", "バナナ", "オレンジ"];

for (let i = 0; i < fruits.length; i++) {
  console.log(`好きな果物: ${fruits[i]}`);
}

1つずつ処理を書く必要がありません。

3. 要素の追加・削除が簡単

const fruits = ["りんご", "バナナ"];

// 要素の追加（次回学習予定）
fruits.push("オレンジ");
console.log(fruits);
// ["りんご", "バナナ", "オレンジ"]

Pythonのリストとの比較

JavaScriptの配列は、Pythonのリストとほぼ同じです。

# Python（リスト）
fruits = ["りんご", "バナナ", "オレンジ"]
print(fruits[0])  # りんご
print(len(fruits))  # 3

// JavaScript（配列）
const fruits = ["りんご", "バナナ", "オレンジ"];
console.log(fruits[0]);  // りんご
console.log(fruits.length);  // 3

主な違い

項目PythonJavaScript
要素数の取得len(配列)配列.length
定義変数名 = [...]const 変数名 = [...]

今日の学びのポイント

  • 配列: 複数の値をまとめて管理
  • ["値1", "値2", ...] で定義
  • インデックス番号は0から始まる
  • 配列[インデックス] で要素を取得
  • 配列[インデックス] = 新しい値 で更新
  • 配列.length: 要素数を取得
  • for文と組み合わせることで威力を発揮

配列は、プログラミングで最も頻繁に使うデータ構造の1つです。次は、配列と似た「オブジェクト」を学びます。

コメント