for of문 사용법 & 예제 정리

for of문 사용법

for (변수 of iterable) {
    // 각 요소에 대한 코드
}

• 변수: 각 반복에서 현재 요소의 값을 할당하는 변수입니다.
• iterable: 순회 가능한 객체입니다.

 

for of문 사용 예시

const testMap = new Map([
    ['이름', '홍길동'],
    ['나이', 30],
    ['지역', '서울']
]);

for (const [key, value] of testMap) {
    document.write(`${key}: ${value} <br>`);
}

결과 :

이름: 홍길동
나이: 30
지역: 서울

 

for of문을 사용하면 내부적으로 iterator가 내장되어 있기 때문에 이 부분을 생략하고 진행이 가능합니다. const[key,value] 부분에서 map의 키, 값을 할당하고 화면에 출력하게 됩니다.

 

for of문 사용시 주의사항

 

순회 가능한 객체에만 사용이 가능

 

for...of는 배열, 문자열 Map, Set처럼 순회 가능한(iterable) 객체에서만 사용이 가능합니다. 순회가 불가능한 객체라고 하면 대표적으로 Object가 있습니다. 본래 객체는 iterator를 사용할 수 없기 때문에 for of를 사용할 수 없고 객체를 순회할 때는 for of문이 아니라 for in문을 사용하는 것이 좋습니다.

 

인덱스 접근 불가

 

for of문은 인덱스에 직접 접근할 수 없습니다. 인덱스가 필요한 경우에는 for in문을 사용하거나 그냥 for문을 사용해야 합니다.

 

break와 continue 사용 가능

 

forEach문에서는 break와 continue를 사용할 수 없지만 이 for of문에서는 break와 continue를 사용할 수 있습니다. 이 break와 continue를 사용하여 특정 조건에서 반복을 중단하거나 건너뛰는데 사용할 수 있습니다.