for in 반복문 과 for of 반복문의 차이

# for in 반복문

for in 반복문은 배열의 인덱스를 따라서 명령을 반복 수행한다. 

모든 배열에는 요소들이 있고 그 요소 순서대로 인덱스를 붙인다. 첫번째 요소의 인덱스는 0, 두번째 요소의 인덱스는 1, 세번째 요소의 인덱스는 2 ...... 이런식이다. 

 

그 인덱스가 0일때 명령을 실행하고, 

그 인덱스가 1일때 명령을 싱행하고,

그 인덱스가 3일때 명령을 싱행하고,

......

이런식으로 반복하다가 마지막 인덱스까지 도달하면 멈춘다. 

      const array = ['사과', '배', '귤', '바나나']

      console.log('# for in 반복문')

      for (const i in array) {

        console.log(i)

      }

 

위와 같은 코드가 있다면 console 에는 이렇게 찍힐 것이다. for in 구문에서 i 는 인덱스이기 때문이다.

# for in 반복문
0
1
2
3

 

한가지 주의할점은, 만약 배열이 아닌 객체에 대해서 for in 구문을 돌린다면 for in 코드는 객체의 프로퍼티들 하나하나에 대해서 명령을 반복 수행할 것이다. 

 

 

# for of 반복문

for of 반복문은 배열의 요소들을 순서대로 불러내어 명령을 실행한다. 인덱스를 불러내는 것이 아니라 요소 자체를 불러낸다. 

아래 코드는 console에 어떻게 찍힐까?

      const array = ['사과', '배', '귤', '바나나']

      console.log('# for of 반복문')

      for (const i of array) {

        console.log(i)

      }

아래처럼 찍힌다. 요소들을 i라는 반복변수에 넣어 명령을 실행하고, 그것을 요소 순서대로 반복하기 때문이다.  

# for of 반복문 
사과
배 
귤 
바나나

 

for in 과 for of의 차이를 기억하자. for in 의 in을 인덱스와 연결시키면 좋겠다.^^