forEach 반복문은 배열에서 사용 가능한 반복문이며 배열 안의 모든 요소에 접급하며 요소의 인덱스에 접근이 가능한 반복문입니다.
for - of 반복문의 경우 배열 안의 요소에는 접근이 가능하나 해당 요소의 인덱스에 접근이 불가능하다는 단점 때문에 추가로 카운트 변수를 만들어주어야 했습니다.
for - of / for - in 반복문
반복문이라고 하면 가장 먼저 떠오르는 반복문은 다양한 프로그래밍 언어에서 사용되고 있는 for 반복문과 while 반복문일 것입니다. 저 또한 그랬고 많은 분들이 for - of 반복문과 for - in 반복문은
nicehyun12.tistory.com
forEach 반복문 예시 코드와 함께 정리해보도록 하겠습니다.
사용 예시
배열.forEach( ( 매개변수 1, 매개변수 2, 매개변수 3 ) => {
함수 실행문
})
forEach 반복문은 인자로 콜백 함수를 받습니다.
인자로 받은 콜백 함수는 최대 3개의 인자를 받으며 배열 안의 전체 요소에 대하여 함수 실행문이 실행되기 때문에 for - of 반복문처럼 사용이 가능합니다.
함수의 인자로 받는 것은 아래와 같습니다.
매개변수 1은 배열 안의 각각의 요소를 담는 변수입니다.
매개변수 2는 처리할 현재 요소의 인덱스입니다.
매개변수 3은 forEach를 호출한 배열입니다.
아래 예시 코드는 배열 안의 요소에 0.2를 곱한 결과를 다른 배열에 추가하는 코드입니다.
const nums = [1, 2, 3, 4, 5, 6];
const multiplyValue = 0.2;
const results = [];
nums.forEach((num) => {
results.push(num * multiplyValue);
});
console.log(results); // [0.2, 0.4, 0.6000000000000001, 0.8, 1, 1.2000000000000002] 출력
매개변수를 하나만 사용했기 때문에 num은 전체 배열 nums 안의 각각의 요소를 담을 변수이며 각각의 요소는 함수 실행문을 실행하게 됩니다.
const nums = [1, 2, 3, 4, 5, 6];
const multiplyValue = 0.2;
const results = [];
nums.forEach((num, idx) => {
const result = num * multiplyValue;
results.push(result);
console.log(`${idx} 인덱스에 ${result} 추가`);
});
함수의 두 번째 매개변수를 추가해주면 각각의 요소의 인덱스에 접근이 가능하게 됩니다.
'JavaScript' 카테고리의 다른 글
filter() (0) | 2022.09.07 |
---|---|
sort()와 reverse() (0) | 2022.09.07 |
slice()와 concat() (0) | 2022.09.06 |
splice() (0) | 2022.09.04 |
배열에 요소 추가 & 제거하기 (0) | 2022.09.04 |