티스토리 뷰

 

자바스크립트의 반복 메소드

기본 동작

배열 내 모든 요소들을 순회하면서 특정 작업을 수행하거나 특정 조건을 만족하는 요소를 가져오는 등 반복적인 작업에 사용한다.

첫번째 인수로 콜백함수를 받는다. 콜백 함수는 일반적으로 다음과 같이 3개의 인수를 사용한다.

function(element, index, array)

forEach()

배열 내 각 요소를 순서대로 처리한다.

예제

forEach() 예제
예제 결과

forEach() 특징

반환 값이 없다. 원본 배열을 변경시킬 수 있다.

map()

배열 내 각 요소를 순서대로 변환 처리후, 처리 결과를 새 배열로 반환한다.

예제

map() 예제
예제 출력

map() 특징

배열 내 각 요소별로 처리하되, 새로운 결과 배열을 반환한다.

새 배열을 출력하면서 같은 크기를 유지하지만 개별 요소의 내용은 변경 가능

 

 

forEach()와 map()차이점을 보여주는 예제

각 변수에 각 메소드 반환값 넣어줌
예제 출력

arrForEach 변수에는 forEach() 메소드가 수행 된 반환값을 저장하고,

arrMap 변수에는 map()로 수행 된 반환값을 저장하고 출력하였다.

forEach()는 반환을 하지 않는 메소드라 undefined가 출력되고,

map()은 원본 배열(arr)의 모든 요소가 1씩 증가한 배열이 출력되었다.

 

 

참고 자료

'Javascript' 카테고리의 다른 글

자바스크립트 - 정규표현식  (0) 2022.02.17
자바스크립트 - 배열 메서드 reduce()  (0) 2022.02.16
자바스크립트 - 함수  (0) 2022.02.16
for문 변형 - for in, for of  (0) 2022.02.16
for문을 이용해서 출력하기  (0) 2022.02.16
댓글
© 2018 webstoryboy