티스토리 뷰

.객체를 다루는 for문인 for in 반복문에 대해 알아보겠습니다.

for in 반복문은 객체 안에 있는 프로퍼티들을 가지고 반복적인 동작을 수행할 때 사용합니다.

객체의 프로퍼티 네임을 가져오는 반복문이기 때문에 일반적인 for문으로는 대체할 수 없는 조금 특별한 반복문입니다.

// for...in
for (변수 in 객체) {
	동작부분
}

기본 구조부터 살펴보면 일반적인 for문과 비슷하지만 소괄호 내부가 조금 다릅니다.

소괄호 내부에서 특정한 변수를 만들고 in이라는 키워드 다음에 반복할 객체를 넣어 주게 되면 이 객체의 프로퍼티 네임이 변수에 할당되고 객체에 프로퍼티 개수만큼 동작을 하게 됩니다.

// for..in
let codeit = {
 name: '코드잇',
 bornYear: 2017,
 isVeryNice: true,
 worstCourse: null,
 bestCourse: '자바스크립트 프로그래밍 기초'
}

for(let k in codeit) {
	console.log(k);
    console.log(codeit[k]);
}

codeit이라는 객체를 하나 만들어서 for...in 문으로 반복하는 코드입니다.

소괄호 내부를 보면 key라는 변수를 만들고 in codeit이라고 했으니까 codeit 객체의 프로퍼티 개수만큼 반복을 하는데 이때 key라는 변수에 이 codeit 객체인 프로퍼티 네임들이 차례대로 전달되는 방식입니다. 그래서 key를 그대로 출력해보면 각 프로퍼티 네임들이 순서대로 출력되는 것을 확인할 수 있습니다. 이해를 돕기위해 변수 이름을 key라고 지었지만 말 그대로 임의의 변수이기 때문에 k라고 해도 되고 그때그때 상황에 어울리는 이름을 지어주면 됩니다.

대괄호 표기법을 활용하면 프로퍼티 값에도 접근할 수 있습니다. 

 

정리하면 객체 내부에 있는 모든 프로프티 값들을 하나씩 다루어야 하는 경우에는 이렇게 for...in 반복문을 활용할 수 있습니다.

'프론트엔드 > JavaScript' 카테고리의 다른 글

[객체] 12. Date객체  (1) 2022.10.03
[객체] 10. for...in 주의사항  (0) 2022.10.02
[제어문] 16. break와 continue  (1) 2022.09.30
[제어문] 13.while문  (0) 2022.09.29
[제어문] 10. for문 Tip  (0) 2022.09.28
공지사항
최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday
링크
«   2024/12   »
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30 31
글 보관함