본문 바로가기
front/html,Js,타임리프

자바스크립트 forEach()반복문

by Ms.Pudding 2022. 1. 15.

자바스크립트에서는 forEach()를 이용하여 반복문을 작성할 수 있다.

<script>

function func(){

	const items = [12,24,36];
    const copy = [];
    
    items.forEach(function(item){
    	copy.push(item+item+2);
    })
    
    document.write(copy);
}
func();

</script>

-> 26,50,74

1.function안에 있는 item은 타입 정의를 해주지 않았지만 items를 받는 변수이다 . (자바스크립트는 타입이 없음) 

 

2.function func()로직을 정의해주고 한번더 func()메소드를 불러내야 작동한다.

 

게시판 만들기에서 제이쿼리를 이용하는 자바스크립트를 가지고도 forEach를 사용한 적이 있다.

제이쿼리에서는 $.each로 써준다.

 $.each(result.data, function(index,obj){
               var tr = $('<tr></tr>')
               var td = '';
               td += '<td style = "text-align:center">' + obj.boardNo+'</td>';
               td += '<td style = "text-align:left">' + obj.title+'</td>';
               td += '<td style = "text-align:left">' + obj.writer+'</td>';
               td += '<td style = "text-align:left">' + obj.regDate+'</td>';
                //apend tr에 넣는 다는 뜻 , tbody에 넣는다는 뜻
                tr.append(td);
                tbody.append(tr);
           });

1.DOM에 있는 데이터를 가져오는 셀렉터 기능도 하기 때문에 $를 사용한거 같다.

 

2.data를 이용해 obj를 반복하겠다. obj앞은 인덱스 값으로 신경 X 

댓글