for...in, for... of について整理したのでメモ
for...in
特徴
- 配列ならインデックス、オブジェクトならプロパティ名を取得できる
配列
const numbers = [1, 2, 3, 4, 5];
for (const index in numbers) {
console.log(index); // Outputs: 0, 1, 2, 3, 4
}
オブジェクト
const person = { name: "John", age: 30, city: "New York" };
for (const property in person) {
console.log(`${property}: ${person[property]}`);
}
for...of
特徴
- 値を取得できる
- イテレータオブジェクトをループできる
配列
const numbers = [1, 2, 3, 4, 5];
for (const number of numbers) {
console.log(number * 2);
}
オブジェクト
const person = { name: "John", age: 30, city: "New York" };
for (const value of Object.values(person)) {
console.log(value); // Output: John, 30, New York
}
※personはイテレータオブジェクトではないので、Object.values でイテレータオブジェクトに変換する必要がある
console.log(Object.values(person))
// ['John', 30, 'New York']
まとめ
for...in はインデックス、プロパティ名を取得できる for...of は値を取得できる オブジェクトをfor...of でループする時は、Object.values で配列に変換してやる必要あり。