Section 2 [unit 1] - 고차함수

kongchip·2022년 7월 21일
0
post-thumbnail

일급객체(first Class Object)

특징

  1. 변수에 할당 가능 (함수 표현식으로 보면 편하다)
const a = function (el) {
  return el * el;
} 




2. 다른 함수의 전달인자(agurement)로 전달 가능 - 콜백함수

  • 콜백함수란 ?
    함수에 인자로 전달되는 함수
function num(el){
  return el * el;
};

function newNum(func, el1) {
  return func(el1);
}

let result = newNum(num, 5); // 25
  • newNum은 다른 함수를 인자로 받은 고차함수
  • func은 newNum의 콜백함수
  • num은 newNum의 콜백함수




3. 다른 함수의 결과로서 리턴 가능

function add(num1){
  return function (num){
    return num1 + num2;
  }
}
add(1)(2); // 3
  • qusghksrkqtdmfh tkdydgkf tn dlTek.


  1. 고차함수로 활용 가능
		const a = function (el) {
          return el * el;
        } 

고차함수(Higher order function)

  • 고차함수란 함수를 전달인자(agurement)나 매개변수(parameter)로 받거나 함수를 리턴하는 함수를뜻한다.
  1. 다른 함수를 인자로 받는 경우
function double(num){
  return num * 2;
}

function doubleNum(func, num) {
  return func(num);
}

let result = doubleNum(double, 9); // 18
  • 함수 doubleNum은 다른 함수를 인자로 받는 고차함수
  • 함수 doubleNum의 첫번째 인자 func에 함수가 들어올경우 함수 func는 함수 doubleNum의 콜백 함수
  • 함수 double은 함수 doubleNum의 콜백 함수


  1. 함수를 리턴하는 경우
function adder(added) {
  return function (num) {
    return num + added;
  };
}
// adder(5)는 함수기 때문에 '()' 사용 가능
let output = adder(5)(3); // -> 8
console.log(output); // -> 8
// adder가 리턴하는 함수를 변수에 저장 가능
const add3 = adder(3);
output = add3(2);
console.log(output); // -> 5
  • 함수 adder는 다른 함수를 리턴하는 고차 함수
  • adder는 인자 한 개를 입력받아서 함수(익명 함수)를 리턴
  • 리턴되는 익명 함수는 인자 한 개를 받아서 added와 더한 값을 리턴


  1. 함수를 인자로 받고, 함수를 리턴하는 경우
function double(num) {
  return num * 2;
}

function doubleAdder(added, func) {
  const doubled = func(added);
  return function (num) {
    return num + doubled;
  };
}

// doubleAdder(5, double)는 함수이므로 함수 호출 기호 '()'를 사용가능
doubleAdder(5, double)(3); // -> 13

// doubleAdder가 리턴하는 함수를 변수에 저장할 수 있습니다. (일급 객체)
const addTwice3 = doubleAdder(3, double);
addTwice3(2); // --> 8
  • 함수 doubleAdder는 고차 함수
  • 함수 doubleAdder의 인자 func는 함수 doubleAdder의 콜백 함수
  • 함수 double은 함수 doubleAdder의 콜백으로 전달됨

배열 내장 메서드

  1. fliter
  • 배열의 각 요소에 콜백 함수를 적용 시켰을 때 true를 리턴하는 요소들만 모은 새로운 배열을 리턴
function obj(arr) {
  return arr.filter(function (el) {
    if(el.length % 2 === 1) {
      return true;
    } return false;
  });
}

let a = obj(['hi','now','good','there']);
console.log(a) // ['now', 'there']



  1. map
  • 배열의 각 요소에 콜백 함수를 적용 시켰을때, true를 리턴하는 요소들만 모은 새로운 배열을 리턴
ffunction obj(arr) {
  return arr.map(function (el) {
    return el * 2
  })
}

let a = obj([1,2,3,4]);
console.log(a) // [2,4,6,8]



  1. reduce
  • 배열의 각 요소를 특정 함수에 따라 원하는 하나의 형태로 응축
  • reduce매소드는 초깃 값을 정할 수 있는데 만약 지정해주지 않는다면 배열의 첫번째 요소가 초깃 값이 됨
function obj(arr) {
  return arr.reduce(function (acc, cur) {
    return acc + cur
  }, 0)
}

let a = obj([1,2,3]);
console.log(a)
  • 초깃값 0, 현재값 1(acc), 누적값 0(cur)일때 배열의 첫번째 요소인 1과 누적값 0을 더함 ( 1 + 0 = 1(누적값)) -> 두번째 요소인 2와 누적값 1을 더함 ( 1 + 2 = 3(누적값) -> 세번째 요소인 3과 누적값을 더함 ( 3 + 3 = 6(누적값)

profile
좋은 프론트엔드 개발자가 되기위한 블로그

0개의 댓글