LoginGustBookCategories
Categories
Frontend

함수형 자바스크립트 기본기

thumbnailCreatehb21·2023년 6월 25일 11:37

https://velog.velcdn.com/images/alsghk9701/post/030d3c3a-5c0f-4cd9-88f5-2d1b9c862ecd/image.jpeg

평가와 일급

# 평가
  - 코드가 계산(Evaluation) 되어 값을 만드는 것
  
평가라는 용어는 코드가 계산되는 것을 말한다. 
  
# 일급
  - 값으로 다룰 수 있다.
  - 변수에 담을 수 있다.
  - 함수의 인자로 사용될 수 있다.
  - 함수의 결과로 사용될 수 있다.
  
  const a = 10;
  // a라는 변수에 10이라는 값을 담는다. 
  const add10 = a => a + 10;
  const r = add10(a);
  // add10의 인자로 a가 전달될 수 있다.
  // 함수릐 리턴값으로 사용될 수 있다.
  console.log(r); // 20


일급 함수

const a = 10;
const add10 = a => a + 10;
// const 

## 일급 함수
  - 함수를 값으로 다룰 수 있다.
  - 조합성과 추상화의 도구
  
자바스크립트에서 함수는 일급이다. 
함수가 일급이라는 이야기는 함수를 값으로 다룰 수 있다는 이야기이다.

함수를 값으로 다룰 수 있다는 이야기는 변수에 함수를 값으로 담을 수 있다는 것이다.

const add5 = a => a + 5;
console.log(add5(5));  // 10

위처럼 add5를 값처럼 다뤄서 함수에세 전달하면 출력을 할 수도 있고 함수의 인자로 함수가 사용될 수 있다. 
그리고 함수는 평가에서 결과로 만들어서 값을 또 다른 함수에게 전달할 수가 있다.


또한 함수가 일급이라는 것은 함수의 결과값으로 함수가 사용될 수 있다는 것이다.
const f1 = () => () => 1;
console.log(f1());  // () => 1
f1이라는 함수는 실행됬을 때 다시 함수를 리턴할 수가 있다.
그래서 f1을 실행한 결과를 전달하면 함수가 출력이 되고, 즉 f1 함수의 결과는 함수인 것이다. 

그리고 이런 함수는 또 다른 변수에 담을 수가 있다.
const f2 = f1();
console.log(f2); // () => 1
// 마찬가지로 f2를 출력해보면 함수가 출력이 된다.
console.log(f2());  // 1
// 담겨진 함수를 내가 원하는 시점에 평가해서 결과를 만들 수 있다.


자바스크립트에서는 함수가 일급이라는 이야기는 자바스크립트에서 조합성과 추상화의 도구로 함수를 잘 사용할 수 있다는 이야기이도 하다.

함수형 프로그래밍에서는 함수가 일급이라는 성질을 이용해서 많은 조합성을 만들어 내고 또 추상화에 좋은 도구로 사용된다.


고차 함수

# 고차 함수
  - 함수를 값으로 다루는 함수
  
## 함수를 인자로 받아서 실행하는 함수
  - apply1
  - times

일급 함수는 함수가 값으로 다뤄질 수 있다는 이야기였다.
고차 함수는 이러한 사실을 이용한, 함수를 값으로 다루는 함수이다.

고차 함수는 크게 두가지가 존재하는데, 함수를 인자로 받아서 실행해주는 함수가 있고 함수를 만들어서 리턴하는 함수가 있다.

이 두가지 중 함수를 인자로 받아서 안에서 실행하는 함수를 다음 예제를 통해 살펴보도록 한다.

const apply1 = f => f(1);
const add2 = a => a + 2;
console.log(apply1(add2)); // 3으로 평가되고 있다.

apply1이라는 함수는, 함수가 함수를 받아서 안에서 실행하고 있기 때문에 고차 함수라고 말한다. 현재는 add2 라는 함수를 인자로 받고 있지만, 이 외에도 다양한 함수를 인자로 받을 수 있다.

두 번째 예시를 보자.

const times = (f, n) => {
 let i = -1;
 while (++i < n) f(i);
}

times(console.log, 3); // 0 1 2
times(a => console.log(a + 10), 3); // 10 11 12

times라는 함수는 함수를 인자로 받고 또 다른 값을 받아서 내부에서 인자로 받은 함수를 실행하면서 자기가 원하는 어떤 인자를 적용하는 고차 함수이다.
이러한 프로그래밍을 applicative 프로그래밍이라고도 한다.


이번에는 함수를 만들어서 리턴하는 함수를 살펴보도록 하자.

## 함수를 만들어 리턴하는 함수 (클로저를 만들어 리턴하는 함수)
  - addMaker

const addMaker = a => b => a + b;
const add10 = addMaker(10);
console.log(add10); // b => a + b
console.log(add10(5)); //  15
console.log(add10(10)); //  20

함수가 실행되었을 때 함수를 리턴하고 있다. 
addMaker는 함수를 리턴하는 함수이며, 그러면서 클로저를 만들어 리턴하는 함수이다. 

클로저는 b => a + b; 함수가 원래의 a를 계속해서 기억하고 있다라는 뜻이다. 
따라서 b => a + b; 는 함수이자 a를 기억하는 클로저이다.
© 2021 Createhb21.