[Javascript] 고차함수

한효찬·2024년 10월 6일

[공부] Javascript

목록 보기
24/24

고차함수에 대해 공부해보았다.

지금까지는 for문이 익숙한데 아무래도 가독성문제 때문에
고차함수를 보편적으로 많이 쓴다고 한다.

나도 map, filter, reduce를 몇 번 사용해보기도 했고 간편해서
제대로 써먹기 전 공부해본다.

map

map은 배열에 쓰이는 함수로써 배열의 요소 순서대로 콜백 함수를 적용시킨 후 새로운 배열로 반환한다.

const nums = [1, 2, 3, 4];

const nums2 = nums.map((num) => num * 2);
console.log(nums2);

예시를 써보았다.
nums의 각 요소들을 num이라는 임시 매개변수에 전달해서 각각 2씩 곱했다.
결과적으로 nums2라는 새로운 배열을 반환했다.

filter

filter도 배열에 쓰이는 함수로써 배열의 요소에 어떠한 조건을 걸고 그 조건에 맞는 요소만 새 배열로 반환한다.

const names = ['abc', 'feg', 'jab', 'jil', 'fih', 'wab', 'uua'];

const names2 = names.filter((name) => name.includes('a') === true);
console.log(names2);

names의 'a'가 포함된 문자열만 필터해서 새로운 names2 변수에 저장했다.

reduce

뭔가.. 가장 어렵게 느껴지는 고차함수.. 매개변수의 종류가 많아서 어렵다.

reduce는 전 요소의 반환 값, 초기값을 인자로 받는 고차함수이다.
배열이 끝날 때까지 요소를 돌면서 콜백함수를 적용하고 그 반환값을 다시 인자로 받아서 다시 콜백함수를 적용하고를 반복한다.
배열이 다 끝나면 최종 반환값 1가지를 최종 변수로 반환한다.


const nums = ['dfdf', 'fff', 'ff', 'f'];

const nums2 = nums.reduce((acc, num) => acc + num.length, 0)
console.log(nums2)
  • 배열의 문자열의 수를 모두 더하는 코드이며 초기값을 0으로 두었다.
  • 순서대로 0 + 4 = 4 / 4 + 3 = 7 / 7 + 2 = 9 / 9 + 1 = 10으로 누적되며 더해진다.
profile
hyohyo

0개의 댓글