Javascript 배열에서 특정 값을 카운트하는 방법

'Array.prototype.reduce()' 메서드를 사용하여 배열 요소를 순회하며 특정 값의 출현 횟수를 계산합니다.

찾고자하는 값이 '1' 일 경우에 대한 예시를 보겠습니다.

const arr = [1, 2, 3, 4, 1, 2, 1];
const targetValue = 1;

const count = arr.reduce((acc, cur) => {
  if (cur === targetValue) {
    return acc + 1;
  } else {
    return acc;
  }
}, 0);

console.log(count); // 3

 

위 코드에서 'arr'은 배열이며 'targetValue'는 카운트할 값을 의미합니다.
'reduce()' 메서드를 호출할 때 초기값으로 '0' 을 전달하고, 첫 번째 매개변수로는 누산기 함수를 전달합니다.
이 함수에서는 현재 요소가 'targetValue' 와 같은지 검사하고, 같으면 acc 값에 1을 더한 값을 반환하고, 다르면 acc 값을 그대로 반환합니다.
'reduce()' 메서드가 반환하는 최종 결과값은 배열에서 'targetValue' 의 횟수가 됩니다.

 

 

'reduce' 함수의 사용법

 

'Array.prototype.reduce()' 함수는 JavaScript 배열에서 사용할 수 있는 고차 함수(higher-order function) 중 하나입니다. 이 함수를 사용하면 배열 요소를 순회하면서 값을 누적하거나 변형할 수 있습니다. 'reduce()' 함수는 다음과 같은 구문을 가집니다

array.reduce(callback, initialValue);

여기서 각 매개변수의 역할은 다음과 같습니다
1. 'callback': 이 함수는 배열 요소를 처리하고 누적값을 계산하는 데 사용됩니다. callback 함수는 다음 4개의 매개변수를 받습니다:
● 'accumulator' (누산기): 콜백 함수에서 반환된 값 또는 누적된 결과값을 나타냅니다.
● 'currentValue' (현재 값): 현재 순회 중인 배열 요소의 값입니다.
● 'currentIndex' (현재 인덱스): 현재 순회 중인 배열 요소의 인덱스입니다.
● 'array' (배열): reduce()를 호출한 배열 자체입니다.

 

 

2. 'initialValue' (초기값, 선택 사항): 이 매개변수는 누산기의 초기값을 지정합니다. 만약 지정하지 않으면 배열의 첫 번째 요소가 초기값으로 사용됩니다.

'reduce()' 함수는 배열을 왼쪽에서 오른쪽으로 순회하며 'callback' 함수를 각 요소에 대해 호출합니다. 각 호출에서 'callback' 함수는 이전 호출에서 반환한 누산기 값을 받아와 현재 요소와 함께 처리하고 새로운 누산기 값을 반환합니다. 마지막 배열 요소까지 처리한 후 최종 누산기 값이 'reduce()' 함수의 반환값이 됩니다.

 

예를 들어, 아래의 코드는 배열의 모든 요소를 더하는 간단한 'reduce()' 사용 예시입니다

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

const sum = arr.reduce((accumulator, currentValue) => {
  return accumulator + currentValue;
}, 0);

console.log(sum); // 15

위 코드에서 'reduce()' 를 사용하여 배열의 모든 요소를 더하고 있습니다. 초기값으로 '0' 을 전달했고, 'callback' 함수에서는 누산기 값과 현재 값을 더해 새로운 누산기 값을 반환하고 있습니다. 결과적으로 'sum' 변수에는 배열 요소의 합계인 15가 저장됩니다.