Reduce,map,filter는 배열 기반 메소드들로써, 그 사용 빈도가 빈번하고, 필수적인 이해도와, 숙련도가 요구되어진다.
reduce() 메소드는 배열의 각 요소에 대해 주어진 리듀서 (reducer) 함수와 초기값으로 메소드를 실행하고, 하나의 결과값을 반환한다.
구문 : arr.reduce(callback[, initialValue])
//리듀서 함수인 콜백함수는 4개의 파라미터로 이루어져있다.
->
누산기accumulator (acc)
현재 값 (cur)
현재 인덱스 (idx)
원본 배열 (src)
let olymicRank = [
{ country: "England", rank: 5 },
{ country: "USA", rank: 1 },
{ country: "Russia", rank: 2 },
{ country: "Republic of Korea", rank: 6 },
]; // 배열 정의
let totalPoint = olymicRank.reduce(function (acc, value) { //주로 누산기 , 현재값만을 파라미터로 넣어준다.
console.log(acc);
return acc + value.country;
}, 0); // 마지막에 초기값을 넣어준다.
console.log(totalPoint);
/*
//순서대로 누산값 출력
0
5
6
8
14 <-- totalPoint 값
*/
map() 메소드는 배열 내의 모든 요소 각각에 대하여 정한 논리값을 적용시킨 후 새로운 배열에 그 값을 반환한다.
구문 :arr.map(callback(currentValue[, index[, array]])[, thisArg])
let historyMine = [
{ age: 1, location: "서대문구 남가좌동" },
{ age: 4, location: "양천구 신길동" },
{ age: 5, location: "안양시 인덕원" },
{ age: 7, location: "남동구 간석동" },
{ age: 10, location: "성북구 안암동" },
{ age: 12, location: "종로구 혜화동" },
]; // 배열 정의
let sumMine = historyMine.map(function (move) { // 배열의 요소 값을 참조할 수 있는 move 매개변수 생성
return move.age + 12 + ", " + move.location; // 각각의 인자 값에 12를 더한 후, 지명과 함께 새 배열 submine에 담는다.
});
console.log(sumMine); // map() 메소드로 새로 담긴 subMine 배열
// =>(6) ["13, 서대문구 남가좌동", "16, 양천구 신길동", "17, 안양시 인덕원", "19, 남동구 간석동", "22, 성북구 안암동", "24, 종로구 혜화동"]
filter() 메소드는 피함수에게 주어진 조건을 만족시키는 요소들만을 찾아, 새로이 그 값들만을 담아주는 배열을 생성케합니다.
구문 : arr.filter(callback(element[, index[, array]])[, thisArg])
let arabics = [1, 23, 25, 45, 31, 22, 48, 85, 66, 12, 57, 9, 5, 47, 16, 77];
// 1이상 100미만의 임의의 요소 배열인 arabics 정의
let numbers = arabics.filter((num) => 19 < num && num < 55);
// 19이상이며 55이하인 값들만을 담아주는 numbers 배열 생성
console.log(numbers);
// =>(7) [23, 25, 45, 31, 22, 48, 47]