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

 

 

 

 

 

 

 

 

📌 자바스크립트 배열에서 특정 값 개수 구하기

 

배열에서 특정 값의 개수를 구하는 방법에는 아래와 같은 방법이 있다.

• 반복문
• filter( )
• reduce( )

 

 

 

 

 

1️⃣ 반복문

반복문을 사용해서 원하는 값이 나올 때마다 count 값을 증가시켜나가는 방법이다.

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

let count = 0;
for(let i=0; i < arr.length; i++) {
  if(arr[i] === 'a')  {
    count++;
  }
}

console.log(count) // 2

 

 

 

 

 

2️⃣ filter( )

filter 함수는 배열에서 특정 조건과 일치하는 값을 모아서 새로운 배열로 리턴하는 함수이다.

(callback 함수에서 true를 리턴하는 element들을 모아서 새로운 배열로 만들어 리턴)

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

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

console.log(count) // 2

 

 

파라미터 

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

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

(['a', 'a']와 같은 새로운 배열을 리턴)

 

element => 'a' === element;

arr.filter의 callback 함수이며, element를 파라미터로 받는다.

(element가 'a'와 같으면 true를 리턴)

// ES6의 화살표함수 표기법
element => 'a' === element;

// ES6 이전 표기법
function(element) {
  return 'a' === element;
}

 

 

 

 

 

3️⃣ reduce

reduce 함수는 배열을 순회하면서 callback 함수를 실행하고, 하나의 리턴 값을 반환하는 함수이다.

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

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

console.log(count) // 2

 

 

파라미터 

 

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

2개의 파라미터 (callback 함수, 초기값) 를 입력받은 후,

배열의 값이 'a' 일 때 초기값인 cnt(=0)의 값을 증가시켜 리턴한다.

 

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

arr.reduce의 callback 함수이며, element 값이 'a' 일 때 누적 값인 cnt의 숫자를 증가시켜서 리턴한다.

 

// ES6의 화살표함수 표기법
(cnt, element) => cnt + ('a' === element)

// ES6 이전 표기법
function(cnt, element) {
  return cnt + ('a' === element);
}