先生と生徒の会話形式で理解しよう

生徒

「JavaScriptでオブジェクトの中にある情報を繰り返し取り出すにはどうしたらいいですか？」

先生

「オブジェクトの中身を一つずつ見るときは、for...in文という方法がありますよ。」

生徒

「for...in文って何ですか？for文やwhile文とは違うんですか？」

先生

「似ていますが、特にオブジェクト（名前と値のペア）を繰り返す専用のループです。初心者にも分かるように説明しますね！」

1. for...in文とは何？

for...in文はオブジェクトのプロパティ（キーと値のペア）を一つずつ取り出すためのループ処理です。配列ではなく、名前付きの項目が入ったオブジェクトに向いています。

オブジェクトとは、たとえば「人の名前と年齢」などの情報をまとめたものです。

2. for...in文の基本構文

基本的な書き方は次の通りです。


for (let key in object) {
  // object[key] にアクセス
}

ここで、keyはプロパティ名を表す文字列、objectはループしたいオブジェクトです。

たとえば、次のようなオブジェクトがあります。


const person = {
  name: "太郎",
  age: 28,
  city: "東京"
};
for (let key in person) {
  console.log(key + "：" + person[key]);
}


name：太郎
age：28
city：東京

プロパティ名（name・age・city）がkeyに入り、person[key]で値にアクセスしています。

for...in文は次のような場面に便利です：

JavaScriptのオブジェクトは継承で親から受け継いだプロパティも持てます。そのため、for...in文は見かけ以上のプロパティも取り出す可能性があります。

その回避策としては、hasOwnProperty()メソッドで「自分自身のプロパティかどうか」をチェックすると安全です。

先ほどのpersonオブジェクトにfor...in文とチェックを加えてみます。


for (let key in person) {
  if (person.hasOwnProperty(key)) {
    console.log(key + "→" + person[key]);
  }
}


name→太郎
age→28
city→東京

こうすることで、自分が定義したプロパティだけを安全に扱えます。

for...in文は配列にも使えますが、配列は順番が大切なのでfor...やfor...of文を使う方が扱いやすいです。

オブジェクトのループには最適ですが、配列には別のループのほうが適しています。

メリットを活かすには、hasOwnProperty()チェックを併用して安全に使うのがおすすめです。

今回はJavaScriptのfor...in文を、初心者でもわかるように丁寧に解説しました。オブジェクトのプロパティを一つずつ扱うときに役立つ仕組みです。使い方や注意点を押さえて、プログラミングに挑戦してみてください。