TIL 4주차 4일 - 고차함수

Sang heon lee·2021년 6월 3일
0

TIL 리스트

목록 보기
21/60

학습 내용

1. 일급 객체(first-class citizen)

  • 함수는 자바스크립트에서 특별한 대우를 받는 일급객체이다.

  • 일급 객체로써의 함수 특징
    -- 변수에 할당(assignment) 할 수 있다.
    -- 다른 함수의 인자(argument)로 전달될 수 있다.
    -- 다른 함수의 결과로서 리턴될 수 있다.

  • 변수에 함수를 할당하는 경우

const square = function (num) {
	return num * num;
};

output = square(7);
console.log(output); // 49

2. 고차 함수란? (higher order function)

  • 함수를 인자로 받을 수 있거나, 함수의 형태로 리턴할 수 있는 함수.
  • 다른 함수(caller)의 인자로 전달되는 함수를 콜백함수라고 부른다.

2-1. 다른 함수를 인자로 받는 경우

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

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

let output = doubleNum(double, 4);
console.log(output); // 8

// 함수 doubleNum 은 다른 함수를 인자로 받는 고차함수
// 함수 func, 함수 dobule 가 콜백 함수

2-2. 함수를 리턴하는 경우

function adder(added) {
  return function (num) {
    return num + added;
  };
}

let output = adder(5)(3); //  8
console.log(output); // 8

// 함수 adder 는 다른 함수 를 리턴하기에 고차함수

const add3 = adder(3);
output = add3(2);
console.log(output); // 5
// 함수는 일급 객체이기에 함수 adder 를 변수에 저장할수 있다.

2-3. 함수를 인자로 받고, 함수를 리턴하는 경우```

unction double(num) {
  return num * 2;
}

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

doubleAdder(5, double)(3); // 13

const addTwice3 = doubleAdder(3, double);
addTwice3(2); // 8

3. 배열 메소드 in 내장 고차함수

3.1 filter method

  • 모든 배열의 요소(arr 의 모든 인덱스)중에서 특정조건(함수 isEven)을 만족하는 요소를 걸러내는 메소드
const isEven = function (num) {
  return num % 2 === 0;
};  // '가' 식

let output = arr.filter(isEven);   // '나' 식

let output = arr.filter(function (num) {
  return num % 2 === 0;
})  // '다'식 = '가'식 + '나'식 


let arr = [1, 2, 3, 4];
console.log(output); // [2, 4]

3.2 map method

  • 모든 배열의 요소(arr 의 모든 인덱스)에 특정조건(함수 double)을 적용하는 메소드
const double = function (index) {
  return index * 2 ;
};  // '가' 식

let output = arr.map(double);   // '나' 식

let output = arr.map(function (index) {
  return index * 2 ;
})  // '다'식 = '가'식 + '나'식 


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

3.3 reduce method

  • 모든 배열의 요소(arr 의 모든 인덱스)에 특정조건(함수 double)을 적용한 데이터를 하나의 데이터로 응축하는 메소드
function isSum (sum, index) {
	return sum + index;
}

let initialValue = 0;
let output = arr.reduce(isSum, initialValue);   


let arr = [1, 2, 3, 4];
console.log(output); // 10
function 함수이름 (응축되는 곳, 요소) {
	return 응축되는 곳 + 요소;
}

let 초기값변수 = 0;
let output = 적용대상.reduce(함수이름, 초기값변수);

// 초기값 변수를 0으로 줬기에 응축되는 곳이 시작도 0이다.
  • 초기값변수의 타입에 따라 출력값의 타입이 정해진다.
  • reduce 메소드를 이용하면 filter 메소드, map 메소드를 대체할수 있다. 참고 링크

느낀 점

기존에 알고리즘을 짜는게 1차원적 이라고 한다면 고차함수를 배우면서 2차원적으로 들어갔다는 느낌이다. 고차함수를 이용한다면 기존에 쓰던반복문이나 조건문 등을 대체하고 코드의 길이를 많이 줄일 수 있다는 느낌이다. 오늘 배운 것을 완벽히 내것으로 만들어 기존에 반복문, 조건문으로 해결할려는 계획을 한번 더 생각해서 고차함수로는 안될까? 하는 생각을 한번 더 가져봐야겠다.

미비한 점
1. 나머지 고차함수 학습(forEach, find, sort, some, every)
2. MapReduce 학습하기 (MapReduce Model)
3. 자바스크립트에서 커링(currying)과 클로저(closure)의 차이 이해하기 (js closure vs curry)
4. 선언형 프로그래밍(declarative programming)과 절차형 프로그래밍(imperative programming)의 차이를 배열 메소드를 통해 이해하기 (js imperative vs declarative)
5. 함수의 조합(function composition)에 대해 학습하기 (javascript function composition)

profile
개초보

0개의 댓글