[Javascript] 배열에서 특정 값 개수 구하기

 

배열에서 특정 값 개수를 구하는 방법을 정리하였습니다.

 

1. for 반복문
2. filter
3. reduce

 

 

for 반복문

 

가장 기본적으로 for 반복문을 사용해서 배열을 순회하면서,

원하는 값이 나올 때마다 count 값을 증가시켜나가는 방법입니다.

 

 

filter

 

filter 함수는,

배열에서 특정 조건에 부합하는 값들만을 모아서 새로운 배열로 리턴하는 함수입니다.

filter 함수는 callback 함수에서 true를 리턴하는 element들을 모아서 새로운 배열을 만들어서 리턴합니다.

 

arr.filter(element => 'a' === element);

배열의 filter 함수를 호출하였고, 파라미터로 "element => 'a' === element)" 함수를 전달하였습니다.

 

element => 'a' === element;

filter 함수로 전달된 callback 함수입니다.

위 코드는 아래의 코드와 같습니다.

element를 파라미터로 받고, element가 'a'와 같으면 true를 리턴합니다.

function(element) {
  return 'a' === element;
}

 

arr.filter(element => 'a' === element);

즉, 이 코드는 배열의 element가 'a'인 경우인 경우를 모아서, 새로운 배열을 만들어 리턴합니다.

즉, 이 코드는 ['a', 'a']와 같은 배열을 리턴합니다.

 

arr.filter(element => 'a' === element).length;

"arr.filter(element => 'a' === element)"

이 코드가 배열 ['a', 'a']를 리턴하므로,

이 배열의 길이를 측정하면

배열에서 'a'의 갯수를 구할수 있게됩니다.

 

filter() 함수에 대한 자세한 정리는 아래 포스팅을 참조하세요.

[Javascript] 배열의 특정 값 찾기 - find(), filter()

[Javascript] 배열의 특정 값 찾기 - find(), filter()

 

 

reduce

reduce() 함수를 사용하여 특정 값의 개수를 셀 수도 있습니다.

 

reduce 함수는,

주어진 배열을 순회하면서 callback 함수를 실행하고, 하나의 리턴값을 반환하는 함수입니다.

 

먼저, reduce 함수에 대한 자세한 정리는 아래 링크의 포스팅을 참조하세요.

[Javascript] 배열의 합계, 평균 계산하기 - reduce(), reduceRight()

[Javascript] 배열의 합계, 평균 계산하기 - reduce(), reduceRight()

 

arr.reduce((cnt, element) => cnt + ('a' === element), 0);

reduce() 함수는,

callback 함수와 초기값 0, 

이렇게 2개의 파라미터를 입력받았습니다.

 

(cnt, element) => cnt + ('a' === element);

reduce() 함수의 첫번째 파라미터로 전달된 callback함수입니다.

이 코드는 element의 값이 'a'이면 누적값인 cnt의 숫자를 하나 증가시켜서 리턴합니다.

이 함수는 아래 코드와 의미가 같습니다. (ES6의 화살표 함수가 익숙하지 않다면 아래 코드를 참조하세요.)

// ES6 화살표 함수(Arrow Function)
(cnt, element) => cnt + ('a' === element)
 
// 위 코드는 아래의 코드와 같이 쓸수도 있습니다.
function(cnt, element)	{
	return cnt + ('a' === element);
}

 

arr.reduce((cnt, element) => cnt + ('a' === element), 0);

즉, 이 reduce() 구문은 

배열의 값이 'a'인 경우 초기값이 0인 cnt의 값을 증가시켜서 리턴합니다.

 

 

---

 

Javascript 배열에서 특정값의 개수를 구하는 방법을 알아보았습니다.