for...in
문은 객체 속성에 대해 반복문을 수행한다.
심볼(Symbol)로 키가 지정된 속성은 무시한다.
⚙️ 구문
for (variable in object) { ... }
✅ for...in
1. 심볼(Symbol) 사용 X
const person = {
name: 'Jhon',
age: 23,
phone: '010-2345-1234'
}
for(const info in person ) {
console.log(info);
// name
// age
// phone
}
2. 심볼(Symbol) 사용 O
const person = {
name: 'Jhon',
age: 23,
phone: '010-2345-1234',
}
const phone = Symbol('secondPhone');
person[phone] = "02-123-1234";
for(const info in person ) {
console.log(info);
// name
// age
// phone
}
console.log(person);
// {
// name: 'Jhon',
// age: 23,
// phone: '010-2345-1234',
// [Symbol(secondPhone)]: '02-123-1234'
// }
🛑 for...of
const person = {
name: 'Jhon',
age: 23,
phone: '010-2345-1234'
}
for(const info of person ) {
// TypeError: person is not iterable at Object.
console.log(info);
}
for...of
문은 반복가능한 객체(array
, map
, set
, string
, typedArray
, arguments
객체 등을 포함)에 대해서 반복문을 수행한다.
⚙️ 구문
for (variable of iterable) {
statement
}
✅ for...of
const color = ['red', 'plum', 'aliceblue', 'blue', 'black', 'white'];
for(let item of color) {
console.log(item);
// red
// plum
// aliceblue
// blue
// black
// white
}
✅ for...in
const color = ['red', 'plum', 'aliceblue', 'blue', 'black', 'white'];
for(let item in color) {
console.log(item);
// 0
// 1
// 2
// 3
// 4
// 5
}
for...in
반복문은 객체의 모든 열거 가능한 속성에 대해 반복한다.for...of
구문은 컬렉션 전용이다. 즉, 모든 객체보다 [Symbol.iterator]
속성이 있는 모든 컬렉션 요소에 대해 반복한다.