for문과 while문은 많이 써봐서 손에 익었다. 그치만 for문의 extension으로 for in과 for of이 있다. 이는 언제 쓰면 좋은지와 차이점을 한 번 정리해보자.
일단 어떻게 쓰이는지 보면서 분석해보자.
for (let 변수 in 객체 혹은 배열)
for (let 변수 of 객체 혹은 배열)
겉으로만 두 개를 비교해보면 비슷해보인다. 하지만 변수에 무엇이 들어가느냐가 다르다.
- for in 문에서는 변수에 객체 혹은 배열의 인덱스가 들어간다.
- for of 문에서는 변수에 객체 혹은 배열의 키 혹은 요소가 들어간다.
예시로 다시 확인하기
const todos = ['우유 구매', '업무 메일 확인', '헬스 다녀오기'];
// for in 문
for (const i in todos) {
console.log(`${i}번째 할 일: ${todos[i]}`)
}인덱스 들어간다!
const todos = ['우유 구매', '업무 메일 확인', '헬스 다녀오기'];
// for of 문
for (const todo of todos) {
console.log(`오늘의 할 일: ${todo}`)
}배열의 요소 값이 들어간다!
이렇게 구분지을 수 있다. 그래서 변수명을 지정할 때 구분할 수 있도록 지정하는 게 중요한다. 인덱스이면 i라고 확실히 명시하자.
사실 배열이나 객체의 내장 객체 메소드(ex. filter, map, sort, forEach)
를 사용하면 쉽게 할 수 있지만 분명히 쓰일 때가 있으니 알아두자.
