(기본/기초) Javascript 배열 Map, Filter, Reduce

 

 

자바스크립트 배열에서 forEach나 if문을 활용해서 나름 필터기능을 사용하고는 했었다.
함수형 기법을 조금 적용해 보면, 그러한 행위보다는 위에 나온 3가지 메서드를 활용하는 방법이 조금 더 효율적이고 코드가 깔끔 해 진다.
Map은 배열 내부의 데이터를 변환하는 메소드 이며,
Filter는 true, false를 반환하여 if문의 효과를 가져온다.
Reduce는 데이터의 결과를 단일로 만드는 기능인데..필터기능이 추가된 것이라 보면 될 것 같다.
아래 소스코드를 보자.

var array = [1, 2, 3];
 array = array.map((res)=>{ return res * 2});
 console.log(array);  //1,2,3 배열값이 *2가된다.

 array = array.filter((val)=>{
  return val >2 ? true : false;
 });
 console.log(array);   //2 이하 값이 배열에서 자동 제거가 된다.

 const result = array.reduce((acc, cur, i) => {
   console.log(acc, cur, i);  //i는 인덱스 번호이다.
   //acc는 초기 배열값, 1을 의미하며
   //cur는 현재 배열값을 의미한다.
   //아래 return을 보면 acc값이 cur값과 더해지는데
   //결국 배열의 총 합이 더해지게된다.
   return acc + cur;
 }, 0);
 console.log(result);  //배열의 합이 나온다

foreach를 통해서 내부에서 if문을 쓰는것도 방법이지만..

위와같은 메서드를 통해서 사용하는 것도 하나의 방법인 것 같다.