javascript/기초

for ...in

yongfront 2024. 4. 10. 14:52
반응형
SMALL

for...in 문은 객체의 열거 가능한 속성(property)에 대해 반복하는 데 사용됩니다. 배열에서도 사용할 수 있지만, 배열에는 for...of 문을 사용하는 것이 더 권장됩니다.

구문

for (variable in object) {
// 코드 블록
}

  • variable: 각 반복에서 다음 속성 이름(키)이 할당되는 변수
  • object: 반복되는 객체

예시

  1. 객체 반복
const obj = {
  name: 'John',
  age: 30,
  city: 'New York'
};

for (const prop in obj) {
  console.log(`${prop}: ${obj[prop]}`);
// "name: John", "age: 30", "city: New York"
}

  1. 배열 반복 (권장하지 않음)
const arr = ['apple', 'banana', 'orange'];

for (const index in arr) {
  console.log(arr[index]);// "apple", "banana", "orange"
}

배열에서는 for...in 대신 for...of를 사용하는 것이 더 좋습니다.

주의사항

  • for...in은 객체의 모든 열거 가능한 속성을 반복합니다. 이는 상속된 프로퍼티도 포함됩니다.
  • 순서가 보장되지 않습니다. 객체의 속성 순서는 정의되지 않았기 때문입니다.
  • 배열에서는 for...in을 사용하면 예기치 않은 결과가 발생할 수 있습니다. 배열에는 for...of나 일반 for 반복문을 사용하는 것이 더 안전합니다.

예제

Array.prototype.myCustomMethod = function() {/* ... */ };

const arr = ['a', 'b', 'c'];

// 예상치 못한 결과 발생
for (const index in arr) {
  console.log(index);// "0", "1", "2", "myCustomMethod"
}

// 올바른 방법
for (const value of arr) {
  console.log(value);// "a", "b", "c"
}

위 예제에서 볼 수 있듯이 for...in은 상속된 프로퍼티도 반복하기 때문에 예기치 않은 결과를 초래할 수 있습니다.

따라서 객체를 반복할 때는 for...in을, 배열을 반복할 때는 for...of를 사용하는 것이 권장됩니다.

728x90
반응형
LIST