자바스크립트 반복문

Jay_u·2023년 3월 24일
0
post-thumbnail

자바스크립트에서 반복문을 통해 순회하고 싶을 때 방법입니다.

기본적인 for문

const arrFruits = new Array();

arrFruit1.push("사과1");
arrFruit1.push("사과2");
arrFruit1.push("사과3");
arrFruit1.push("사과4");

for(var i = 0; i <arrFruits.length(); i++ {

	console.log(arrFruits[i]);
    // 넣은 사과가 모두 출력됩니다.
};

또는

forEach 문을 활용한다.

arrFruits.forEach(function(item, index, array) {

	console.log(item);
    
    // item은 현재 위치의 배열의 값입니다.
    // index는 순서입니다.
    // array는 현재 돌고 있는 arrFruits를 의미합니다.
    // 넣은 사과가 모두 출력됩니다.
    
});
arrFruits.forEach(item=> {
	console.log(item);
    
    // 파라미터가 item 하나라면 (내가 필요한게 item만 이라면)
    // 화살표 함수 사용가능
});

for in 과 for of 반복문

위에 있는 foreach문은 오직 array, map , set 객체에서만 사용 가능합니다.

하지만 객체의 속성이나 컬렉션 전용 반복문이 필요한 경우가 있습니다.

for in과 for of는 생김새는 비슷하지만 받을 수 있는 type이 다릅니다.

for of

: 컬렉션 전용 반복문으로 보통 그냥 객체를 순회합니다.
우리가 웹페이지에서 받아온 복수의 태그를 순회할 수 있습니다.

        for(var checkbox of checkboxList) {

            if(!checkbox.checked) {
                bFlag = true;
                break;
            }
        }

for in

: 객체의 속성을 방문합니다.
for of에서 1개의 객체에 방문했을 때 그 객체가 가진 속성에 접근할 때 사용합니다.

	var 객체 = {
    객체속성1 : 값1;
    객체속성2 : 값2;
    객체속성3 : 값3;
    
    }
    
    
	for(var 속성명 in 객체) {
    	 console.log(속성명, 객체[속성명]);
         // 객체속성1 값1, 객체속성2 값2, 객체속성3 값3
    )

특히 of와 in이 헷갈리실 수 있는데
in은 객체 내부의 속성 탐색해서 in이라고 생각하시면 편합니다.

profile
정확한 정보를 전달할려고 노력합니다.

0개의 댓글