TIL - 21.07.07 👨‍💻

고차함수

일급객체

일급객체는 생성, 대입, 연산, 인자 또는 반환 값으로서의 전달 등 프로그래밍 언어의 기본적 조작을 제한없이 사용할 수 있는 대상이며 대표적으로 함수가 있다.

• 일급 객체의 특징
  1. 변수나 자료구조(참조 자료형)에 저장가능하다. 즉, 변수에 할당 가능하다.
  2. 함수의 매개 변수에 전달 가능하다. 다른 말로는, 다른 함수의 인자로 전달 할 수 있다.
  3. 반환 값으로 사용 가능하다.

변수에 할당 할 수 있기에 함수를 배열의 요소나 객체의 속성 값으로 저장할 수 있다.
이 말인즉슨, 함수를 자료형 다루듯 다룰 수 있다는 의미이다.
이는 함수 표현식에서 보다 직관적으로 확인 할 수 있다.

---

고차함수( Higher order Function )

함수를 인자로 받을 수 있고 함수 형태로 반환 할 수 있는 함수이다.
이 때 어떤 함수(caller)에 인자로 전달되는 함수를 callback 함수라고 한다.
(여기서 콜백은 어떤 작업이 끝났을때 호출하는 경우가 많아서 콜백이라 이름 붙혀졌다.)

이 고차함수에서 함수를 리턴하는 함수들을 Currying Function이라고 한다.

---

클로저 함수 vs 커링 함수

클로저 함수는 어휘적 환경을 기억해 전역에서 접근하지 못하는, 함수 안의 변수에 접근할 수 있는 함수 안의 함수를 뜻한다.

커링(Currying) 같은 경우는 func(a,b,c)와 같이 인자 여러 개를 받는 하나의 함수를 func(a)(b)(c)와 같이 인자를 하나씩 받는 여러개의 함수로 만드는 기술이고 이와 같은 함수를 커링 함수라고 한다.

이 커링 함수를 쓰는 이유가 클로저 함수처럼 쓰기 위함인데, func(a,b,c)에서 인자a만 고정하고 나머지 두 함수의 인자만 변수로 두고 싶을때, let funcA = func(a)처럼 외부 함수를 변수에 할당해서 인자를 고정하고 이 뒤에 인자를 그대로 붙혀서(funcA(b)(c))사용할 수 있다.

---

고차함수의 내장 메소드

후술할 filter, map, reduce 메소드들이 고차함수인 이유는 인자를 걸러내기 위한 조건을 명시한 함수로 받기 때문이다.

사실 이건 이전에 배열 메소드 정리하면서 이것들이 고차함수인지 모르고 정리했던 적이 있다.
그래도 그땐 겉핥기도 아니고 그냥 한번 쓱 보는 수준으로 정리했던거라 다시 한번 정리하겠다.

---

filter 메소드

filter메소드는 인자의 조건을 만족하는 요소를 걸러내 새 배열을 반환하는 메소드이다.

filter 메소드의 프로세스는

1. 배열의 요소를 인자의 콜백함수에 전달

2. 콜백 함수는 요소를 판단해 불리언 타입으로 반환

3. 반환 값이 참이면 해당 요소를 새로운 배열에 추가, 거짓이면 건너뛴다.

4. 이 과정을 각 요소마다 적용시키고 요소를 추가한 새로운 배열을 반환한다.

   콜백함수는 truthy 값이나 falsy 값을 반환하기만 하면 되지만 조건을 좀 더 명확히 해서 확실하게 true 또는 false 로 반환하게 함수를 짜는 것이 좋다.

const arr = [
  {name: 'sunghoon', job: 'dev',},
  {name: 'sangsu', job: 'postgrad'},
  {name: 'sungsu', job: 'dev',},

let findDev = arr.filter(item => item.job === 'dev')
console.log(findDev) 
// [ {name: 'sunghoon', job: 'dev',}, {name: 'sungsu', job: 'dev',} ]

예제는 재탕

---

map 메소드

map메소드는 모든 요소를 인자에 적용시켜 반환된 값으로 하는 새 배열을 반환하는 메소드이다.

map메소드의 프로세스는

1. 배열의 요소를 인자의 콜백함수에 전달
2. 콜백함수에 배열의 요소를 대입해서 반환되는 값을 새로운 배열에 추가.
3. 이 과정을 각 요소마다 거치고 요소를 추가한 새로운 배열을 반환한다.

const arr = [1, 2, 3];
let double = arr.map(item => item * 2);

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

---

reduce 메소드

reduce메소드는 모든 요소를 특정 방법에 따라 누적 값에 누적시키고 누적 값을 반환하는 메소드이다.
조금 쉽게 생각해보면 reduce 메소드는 누적 값을 업데이트하고 누적 값을 리턴하는 메소드이다.

reduce메소드의 프로세스는

1. 배열의 요소를 인자의 콜백함수에 전달.
2. 콜백 함수의 인자로 함수를 실행시켜 반환된 값을 누적값에 할당(업데이트)
3. 이 과정을 각 요소마다 거친 후 누적 값을 반환한다.

reduce 메소드는 세번째로 인자를 지정할 수 있는데 숫자열도 넣을 수 있고 문자열도 넣을 수 있으며 객체, 배열도 넣을 수 있다.

let arr = [1, 2, 3];

let sumArr = arr.reduce((acc, cur) => acc + cur, 0);
console.log(sumArr); // 6;

---

GOOD 😉

고차함수 메소드들을 익혔다.
코플릿 풀며 숙련시키는 중 인데 친해질 수 있을 것 같다.
오늘 같이 페어 프로그래밍했던 페어님이랑 역대급으로 재밌게 했다 그래봐야 9번째

BAD 😥

TO DO 🔥

• 공포의 React
• node.js

Retrospect 🧐

사실 고차함수 예습할 시간도 조금 부족했고 악명이 많이 들려와서 많이 쫄았는데, 너무 쫄아서 그런가 생각보다 할만했다 😅

조금 더 친해질 수 있을 것 같은데 오늘 이거 정리하고 나서 고차함수랑 좀 더 친해지기 보다는 우선 리액트랑 인사하고 주말에 친해지는 시간을 가져봐야겠다.

Reference 🙇

https://poiemaweb.com/
https://developer.mozilla.org/