javaScript 객체 순회

회사 프로젝트에서 데이터를 추가하거나 수정할 때 아니면 데이터를 파싱 할 때

 

데이터 유무를 체크하는 기능이 필요한 경우가 항상 있었는데

 

if문을 여러 개 써서 사용하는 것이 비효율적이라고 생각했습니다.

 

그래서 다른 방법이 없나 찾아보다가 for-in, for-of를 사용하면 쉽게 해결된다는 것을 알게 되었습니다.

 

먼저 for-in을 사용한 예부터 보겠습니다.

 

for-in 문

 

위 예시를 보게 되면 obj라는 Obejct를 생성하고

 

아래의 for-in 문에서 Object를 순회하면서 key와 value를 각각 표출하고 있습니다.

 

따라서 key, value를 조회할 수 있으므로 value가 없는 경우

 

예를 들면 사용자 이름이 없는 경우 사용자 이름이 없음을 사용자에게 알릴 수 있습니다.

(alert 함수 또는 팝업 사용)

 

다음으로 for-of를 사용한 예입니다.

 

for-of 문

 

위의 예시도 방금 전의 예와 마찬가지로

 

obj라는 Obejct를 생성하고

 

마찬가지로 그 아래에서 for-of 문에서 Object를 순회하면서 key와 value를 각각 표출하고 있습니다.

 

하나 다른 점이 있다면 Object 객체의 entries 메서드를 사용했다는 점입니다.

 

for-of를 사용하려면 iterable 속성이 있어야 하기 때문입니다.

 

즉 반복이 가능해야 되는데 Array, Map, Set, String과 같은 객체 타입이어야 합니다.

 

entries 메서드를 사용하지 않고 for-of를 순회하려고 한다면 다음과 같은 에러가 발생됩니다.

 

for-of 문 에러 메시지

 

따라서 for-of문을 사용하려면 반복이 가능한 객체 타입이어야 합니다.

 

만약에 Ojbect 객체가 아니라 Map 객체를 순회하면 문제없이 수행되는 것을 확인할 수 있습니다.

 

for-of 문 Map 객체 순회

 

참고로 for-of 문은 ES6부터 추가된 것이라고 하니 지금부터 숙지하고 있으면 좋을 거 같습니다.