[JS 개념] forEach()

forEach()

: 주어진 callback함수를 배열에 있는 각 요소에 대해 오름차순으로 한 번씩 실행한다.

arr.forEach(callback(currentvalue[, index[, array]])[, thisArg])

- callback : 각 요소에 대해 실행할 함수

    - currentvalue(명명된 매개변수) : 처리할 현재 요소

     - index(선택적 매개변수) : 처리할 현재 요소의 인덱스

     - array(선택적 매개변수) : forEach()를 호출한 배열

- thisArg : callback을 실행할 때 this로 사용할 값. //전달되지 않으면 undefined사용

 

 

<사용방법>

1. currentvalue만 사용

const numbers = [1,2,3,4,5];

numbers.forEach(function(number){
	console.log(number);
});

//1
//2
//3
//4
//5

//ES6 화살표 함수 표현 사용하면,
numbers.forEach(number => console.log(number));

 

2. currentvalue, index 사용

: 요소의 인덱스를 확인할 수 있음

numbers.forEach((number, index) => {
	console.log('Index: ' + index + ' Value: ' + number);
});

//Index: 0 Value: 1
//Index: 1 Value: 2
//Index: 2 Value: 3
//Index: 3 Value: 4
//Index: 4 Value: 5

 

3. array 사용

: 원본 배열 그 자체. 단순히 호출하면 배열의 요소 수만큼 배열이 출력됨

numbers.forEach((number, index, array) => {
    console.log(array);
});

//(5) [1, 2, 3, 4, 5]
//(5) [1, 2, 3, 4, 5]
//(5) [1, 2, 3, 4, 5]
//(5) [1, 2, 3, 4, 5]
//(5) [1, 2, 3, 4, 5]

 

 

<예시1>

const array1 = ['a', 'b', 'c'];

array1.forEach(element => console.log(element));

//"a"
//"b"
//"c"

<예시2>

const arraySparse = [1,3,7];
let numCallbackRuns = 0;

arraySparse.forEach(function(element){
	console.log(element);
    numCallbackRuns++;
});

console.log("numCallbackRuns: ", numCallbackRuns);

//1
//3
//7
//numCallbackRuns: 3

 

(참조) https://www.freecodecamp.org/korean/news/javascript-foreach-how-to-loop-through-an-array/

https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach

---

1st 기록 : 23.05.03(수)