[코드스테이츠/21DAY] S2U1 - [JavaScript] 고차 함수

🌊 TIL : 2023년 3월 14일  

: 오늘 section2의 첫 날! 오늘 어제 풀었던 프로그래머스 문제에 나왔던 배열 메서드를 배워서 문제 풀기가 수월하였다.

 

오늘 배운 것 : [JavaScript] 고차 함수

 

일급 객체

특징

1. 변수에 할당할 수 있다
2. 다른 함수의 전달인자로 전달될 수 있다.
3. 다른 함수의 결과로서 반환될 수 있다.

고차 함수

: 고차 함수는 함수를 전달인자로 받을 수 있고, 함수를 반환할 수 있는 함수이다.

다른 함수의 전달인자로 전달되는 함수를 콜백함수라고 한다.

 

1. 다른 함수를 인자로 받는 경우
2. 함수를 리턴하는 경우
3. 함수를 인자로 받고 함수를 리턴하는 경우

 

내장 고차 함수

filter 메서드

• 특정 조건을 만족하는 요소만 걸러낸다.
• 내부 조건에 따라 참 또는 거짓을 반환한다.
• 반환값이 true인 요소로만 구성된 새로운 배열 반환한다.

// 홀수면 true, 짝수면 false를 반환하는 함수
const isOdd = function (num) {
  return num % 2 === 1;
};

let arr = [1, 2, 3, 4];
let output = arr.filter(isOdd); // 홀수인 것으로ㅓ 새 배열을 만들어 반환한다.

console.log(output) // [1, 3]

 

map 메서드

• 배열의 각 요소가 함수에 의해 다른 요소로 지정 된다.
• 콜백 함수의 반환값들로 구성된 새로운 배열을 반환한다.

const numbers = [1, 2, 3, 4];
const squares = (n) => n * n;
const roots = numbers.map((el) => squares(el));

console.log(roots) // [1, 4, 9, 16]

 

reduce 메서드

• 모든 요소를 순회하여 특정 방법(함수)에 따라 원하는 하나의 형태로 반환한다.

const numbers = [1, 2, 3, 4];
const output = numbers.reduce((acc, cur) => acc + cur, 0);
console.log(output) // 1 + 2 + 3 + 4 = 10

 

그 외

• SPA (Single Page Application ) : 단일 페이지로 구성된 웹 애플리케이션
• 메서드 : 객체 안에 프로퍼티로 정의 된 함수
• 개발자도구의 native code : 이미 정의되어있는 코드

 

어려웠던 부분

: reduce / filter / map의 적재적소 찾기

 

느낀점

: 예습을 하니 재밌다!!! 양이 많긴 공부한 내용 위주로 문제를 푸니 술술 풀려서 너무 좋다.

 

 

더 공부할 것

: 배열 고차함수