[JavaScript] for of / in

for...of, for...in

둘 의 차이점은 배열 내부를 탐색하느냐, 객체 내부를 탐색하느냐에 대한 차이라고 할 수 있습니다.

 

for of

- 배열 내부에 접근합니다.

- 이터러블한 객체에 모두 사용 가능합니다. 

- 헷갈리기 쉬운 문법입니다. 헷갈린다면 자바 처럼 일반 for문을 사용하는 것도 괜찮습니다.

const numbers = [10, 20, 30, 40, 50];
 
for (let number of numbers) {
    console.log(number);
} 
 
for (let i=0; i < numbers.length; i++) {
    console.log(numbers[i]);
}
 
// 둘이 같음. 10 20 30 40 50 출력.

 

for in

- 객체 내부에 접근합니다. 

- 모든 프로퍼티에 사용가능합니다.

const doggy = {
    name : '멍멍이',
    sound: '멍멍',
    age : 2
};
 
for (let key in doggy) {
    
    console.log(key);
    // name, sound, age 출력.
    
    console.log(`${key}: ${doggy[key]}`);
    // name: 멍멍이, sound: 멍멍, age: 2 출력.
}

 

 

Object 클래스

- 객체 순회 전용입니다. 

const doggy = {
    name : '멍멍이',
    sound: '멍멍',
    age : 2
};
 
console.log(Object.keys(doggy));
// ["name", "sound", "age"] 출력.
 
console.log(Object.values(doggy));
// ["멍멍이", "멍멍", 2] 출력.
 
console.log(Object.entries(doggy));
// [Array[2], Array[2], Array[2]]
/* 0: Array[2]
	0: "name"
	1: "멍멍이"
   1: Array[2]
	0: "sound"
	1: "멍멍"
...*/