정의 및 사용 방법

for...in 문은 속성(key)으로 순회할 수 있는 객체를 위한 반복문입니다.
속성(key)으로 순회할 수 있는 객체라면 어떤 객체든 for...in 문으로 순회할 수 있습니다. 즉, 객체에서 가져온 속성(key)으로 작동하는 루프를 실행합니다.

속성(key)으로 순회할 수 있는 객체란 열거 가능(enumerable)한 속성(key)를 가지고 있는 객체를 의미합니다.
대표적으로 일반 객체(Plain objects)가 있습니다.

배열도 열거 가능한 속성(key)을 가지고 있습니다. 자바스크립트에서 배열의 속성 이름(key)은 인덱스(정수)입니다.

기본 예제

다음은 속성(key)으로 순회할 수 있는 일반 객체(Plain object)를 for...in 문으로 순회하는 예제입니다.

for...in 문을 사용하여 객체의 속성(key)을 순회할 때, 각 순회마다 변수에는 해당 프로퍼티의 이름이 할당됩니다. 이를 통해 속성의 이름을 가져올 수 있습니다.

JavaScript 
const person = {
    name: "John",
    age: 30,
    occupation: "Developer"
} // 객체 리터럴로 정의된 일반 객체(Plain object)

for (let key in person) {
    console.log(key); // 속성(key) 이름 출력
}
// 출력: "name" "age" "occupation"

구문

JavaScript 
for (variable in object) {
    // 실행할 코드
}
  • variable: 반복문 내에서 현재 순회 중인 속성(key)을 저장할 변수의 이름입니다.
  • object: 반복하고자 하는 이름(key)으로 순회할 수 있는 객체입니다.

특징

for...in 문은 객체의 속성(key)을 순회하는 기능을 제공하지만 몇 가지 주요 특징을 고려해야 합니다. 아래에서는 for...in 문의 주요 특징에 대해 자세히 살펴보겠습니다.

객체의 속성(key)을 순회

for...in 문은 객체의 열거 가능한 속성 이름(key)을 순회합니다. 따라서 루프마다 변수에는 속성 이름이 문자열 형태로 들어갑니다.

속성(key)을 순회하는 순서는 보장되지 않음

속성(key)을 순회하는 순서는 엔진 구현에 따라 달라질 수 있으며, 명세상 보장되지 않습니다. 대부분은 추가된 순서를 따르지만, 항상 일정하다고 가정하면 안 됩니다.

배열 순회에는 적합하지 않음

인덱스의 순서가 중요한 배열을 순회하기 위해 사용하는 것은 추천하지 않습니다.

배열에는 일관된 순서로 순회를 하는 for, for...of, forEach() 같은 반복문을 사용하는 것을 권장합니다.

참고하세요!
for...in 문은 Symbol로 키가 지정된 속성은 무시합니다.

for...in 문으로 객체의 값(value)에 접근하기

for...in 문은 객체의 열거 가능한 속성 이름(key)을 순회하기 때문에, 실제 속성 값(value)에 접근하지 않습니다. 그래서, 실제 속성 값에 접근하려면 obj[key] 형태로 접근해야 합니다.

JavaScript 
const user = {
    name: "철수",
    age: 30
}

for (let key in user) {
  console.log(key, ":", user[key]);  
}
/*
    출력:
    "name" : "철수"
    "age" : 30
*/

유용성

for...in 문의 특징을 살펴본 바와 같이 객체의 속성(key)을 순회하는 기능을 제공하지만, 속성을 순회하는 순서는 보장되지 않는다는 것에 주목할 필요가 있습니다. 즉, 배열의 순회에는 적합하지 않습니다.

그러면 for...in 문은 어디에 사용하는 것이 좋을까요?

주로 for...in 문은 순회를 통해 데이터를 다루는 것 보다는 일반 객체(Plain objects)의 특정 값(value)을 가지는 속성(key)을 확인하는 디버깅용으로 사용됩니다.

명세서

for…in 문에 대한 명세서 사양
명세서 사양
for...in ECMAScript Language Specification
#sec-for-in-and-for-of-statements

브라우저 호환성

for...in 문에 대한 브라우저 호환성
문
데스크탑 Chrome
Chrome
데스크탑데스크탑 Edge
Edge
데스크탑 Firefox
Firefox
Safari
Safari
for...in 1 12 1 1

참고문헌

같이 보기