[JS] for in, for of 기능과 예시

1. for in

for in은 키를 순회하는 기능을 수행합니다.

const obj = { a: 1, b: 2 };

for (let key in obj) {
  console.log(key);       // a, b
  console.log(obj[key]);  // 1, 2
}

객체에서 참조할수 있는 값(Property)을 찾을 때 주로 사용합니다.

 

const admin = "admin";

for (let c in admin) {
  console.log(c);
}

// 결과
// "0"
// "1"
// "2"
// "3"
// "4"

Array나 string을 참조할 때는 index 값을 선언된 변수에 담지만, 프로토타입 속성까지 순회하는 경우가 있어 보통 사용되진 않습니다. 큰 의미가 없는 값인 인덱스 값을 참조하는 게 큰 의미도 없습니다.

 

2. for of

for of는 값을 순회합니다.

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

for (let value of arr) {
  console.log(value);  // a, b, c
}

for (let value of str) {
  console.log(value);  // a, b, c
}

반복 가능한 객체의 값을 순회하는 기능을 가집니다. 배열과 문자열 모두 가장 앞에 있는 값부터 순환하며 변수에 순서대로 데이터를 담습니다. 

 

3. 차이점과 요약

for in과 for of의 기능상의 차이를 이해한다면 어떤 상황에 쓰이는지 이해할 수 있습니다. 객체의 key 값을 참조하는 for in 구문은 객체의 속성을 순회하는 데 사용하고, 객체의 값을 참조하는 for of 구문은 키값의 의미보다 값이 주가 되는 배열, 문자열, set등을 순회하는 데 사용됩니다.