2022/03/20 TIL

 

 

📝 for ... in  문과 for ... of 문의 차이점 

 

 

오늘 알고리즘 공부를 하다가 for in 을 쓴 값과 for of을 쓴 값이 각 각 다르게 출력되는 것을 보았다. 

그리고 알게되었다. 내가 이 둘의 차이를 정확하게 모르고 있었다는 것을 ..! 

 

 

 

 

1. for ... in

- 객체를 순환할 때 사용한다. 

- 객체의 key 값에 접근은 가능하지만 value 에 직접 접근하는 것은 불가능하다. 

- 모든 객체에 적용 가능하다. 

 

 

for in 문에서 주의할 점

- 순서가 보장되지 않음

- length 사용 불가

- value 값이 string 이라 연산이 불가능 

 

 

 

2. for ... of 

- 배열의 반복에서 사용한다. 

- 객체를 순환하려고 할 경우 type error 가 발생한다. 

-length 사용 불가

 

 

 

 

 

 

3. for in 과 for of 의 차이점 

 

- 앞서서 for of는 배열를 순환할 때, for in은 객체를 순환할 때 사용한다고 했다.

그런데, for in으로 배열을 순회하면 에러가 뜨지 않는다.

하지만 for in 으로 배열을 순환하려고 하면 의도와 다른 값을 출력하게 된다. 

왜냐하면 javascript에서는 배열도 하나의 object 타입으로 인식하기 때문이다. 

그래서 해당 배열의 value 값이 아닌 key 값이 되는 index가 반환된다. 

 

 

예시> 문자열에 대문자가 몇 개인지 찾는 알고리즘

 

=> for in 을 사용했을 때 출력 값

for in 일 때

for in 을 사용하여 콘솔에 출력해보면 i 의 value 가 아닌 index가 출력되는 것을 확인할 수 있다. 

따라서 원하는 값이 아닌, index의 개수가 출력되어버렸다. 

 

 

 

=> for of 를 사용했을 때

for of 일 때

for of 를 사용해야 배열의 value 값이 출력되어 원하는 결과 값을 얻을 수 있었다.