Home JS[내장 고차 함수]
Post
Cancel

JS[내장 고차 함수]

JS의 대표적인 내장 고차 함수 3가지

  1. filter
  • 배열의 각 요소가 특정 논리(함수)에 따르면, 사실(true)일 때 따로 분류함(filter)
  1. map
  • 배열의 각 요소가 특정 논리(함수)에 의해 다른 요소로 지정(map)된다
  1. reduce
  • 배열의 각 요소를 특정 방법(함수)에 따라 원하는 하나의 형태로 응축한다(reduction)

filter

1
2
3
4
5
6
7
let arr = [1, 2, 3, 4];

const isEven = function (num) {
  return num % 2 === 0;
};

console.log(arr.filter(isEven)); // [2,4]

이처럼 filter 내부의 리턴되는 값이 true인 경우만 반환한다.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
// 함수 표현식
const cartoons = [
  {
    id: 1,
    bookType: "cartoon",
    title: "식객",
    subtitle: "어머니의 쌀",
    createdAt: "2003-09-09",
    genre: "요리",
    artist: "허영만",
    averageScore: 9.66,
  },
];

// 단행본 한 권의 출판 연도가 2003인지 확인하는 함수
const isCreatedAt2003 = function (cartoon) {
  const fullYear = new Date(cartoon.createdAt).getFullYear();
  return fullYear === 2003;
};

// 출판 연도가 2003년인 책의 모음
const filteredCartoons = cartoons.filter(isCreatedAt2003);

map

1
2
3
4
5
6
7
let arr = [1, 2, 3, 4];

const double = function (num) {
  return num * 2;
};

console.log(arr.map(double)); // [2,4,6,8]

map은 배열의 각 요소를 순회하며 변환 시킬수 있음, for를 대체해서 사용가능

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
const cartoons = [
  {
    id: 1,
    bookType: "cartoon",
    title: "식객",
    subtitle: "어머니의 쌀",
    createdAt: "2003-09-09",
    genre: "요리",
    artist: "허영만",
    averageScore: 9.66,
  },
  {
    id: 2,
    // .. 이하 생략
  },
  // ... 이하 생략
];

// 만화책 한 권의 부제를 리턴하는 로직(함수)
const findSubtitle = function (cartoon) {
  return cartoon.subtitle;
};

// 각 책의 부제 모음
const subtitles = cartoons.map(findSubtitle); // ['어머니의 쌀', ...]

reduce

1
2
3
4
5
6
7
8
9
let arr = [1, 2, 3, 4];

const sum = function (acc, cur) {
  return acc + cur;
  //acc 누적값
  //cur 현재값
};

console.log(arr.reduce(sum)); // 10

reduce는 누적된 값을 계산할때 많이 사용된다

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
const cartoons = [
  {
    id: 1,
    bookType: "cartoon",
    title: "식객",
    subtitle: "어머니의 쌀",
    createdAt: "2003-09-09",
    genre: "요리",
    artist: "허영만",
    averageScore: 9.66,
  },
  {
    id: 2,
    // .. 이하 생략
  },
  // ... 이하 생략
];

// 단행본 한 권의 평점을 누적값에 더한다.
const scoreReducer = function (sum, cartoon) {
  return sum + cartoon.averageScore;
};

// 초기값에 0을 주고, 숫자의 형태로 평점을 누적한다.
let initialValue = 0;
// 모든 책의 평점을 누적한 평균을 구한다.
const cartoonsAvgScore =
  cartoons.reduce(scoreReducer, initialValue) / cartoons.length;
This post is licensed under CC BY 4.0 by the author.