본문 바로가기

이것저것 스터디📚/JavaScript

커링과 클로저

1. 커링(Currying)

- 커링 : 커링은 f(a, b, c)처럼 단일 호출로 처리하는 함수를 f(a)(b)(c)와 같이 각각의 인수가 호출 가능한 프로세스로 호출된 후 병합되도록 반환하는 것이다.

- 커링은 함수를 호출하는 것이 아닌 단지 반환할 뿐이다.

- 함수 호출을 체인으로 연결할 수 있으며, 함수의 재사용성을 높일 수 있다.

 

* 커링 예제

function curry(f) { // 커링 변환을 하는 curry(f) 함수
  return function(a) {
    return function(b) {
      return f(a, b);
    };
  };
}

function sum(a, b) {
  return a + b;
}

const curriedSum = curry(sum);

console.log(curriedSum(1)(2)); // 3
console.log(sum(1,2); // 3

// 화살표 함수로 표현
const curry = f => a => b => f(a,b)

- 위 예제에서 curry(f)의 반환값은 function(a) 형태의 래퍼이며 curredSum(1) 같은 함수가 호출되었을 때, 그 인수는 렉시컬 환경에 저장되고 새로운 래퍼 function(b)이 반환된다.

- 그리고 반환된 function(b) 래퍼 함수가 2를 인수로 호출하고 반환값이 원래의 sum 함수로 넘겨져서 호출된다.

 

2. 클로저(Closure)

- 클로저 : 함수가 자신을 포함하는 외부 스코프에 접근할 수 있는 경우를 말한다.

- MDN에서는 클로저를 "클로저는 함수와 그 함수가 선언될 당시의 Lexicacl environment의 상호 관계에 따른 현상"이라고 정의한다.

- 주로 다른 함수 내에서 함수를 반환하거나, 콜백 함수로 사용될 때 많이 발생한다.

- 클로저는 외부 변수에 대한 참조를 캡쳐하고 저장하기 때문에, 외부 변수의 생명주기가 유지된다.

 

* 클로저 예시

const outer = function() {
	const a = 10;
	const inner = function(b) {
		return a + b;
	}
	return inner;
}

const sum10 = outer();

console.log(sum10(5)); // 15
console.log(sum10(10)); // 20

 

- 위 예제에서 outer 함수의 호출이 종료되었지만, inner 함수는 선언 당시의 외부 lexical environment를 참조할 수 있고, 변수 a에 접근할 수 있다.


* 내 정리

- 커링과 클로저 모두 함수형 프로그래밍의 핵심 요소 중 하나로, 코드를 더 모듈화하고 유지보수하기 쉽게 만들어주는 개념입니다.

- 커링은 f(a, b, c)처럼 단일 호출로 처리하는 함수를 f(a)(b)(c)와 같이 각각의 인수가 호출 가능한 프로세스로 호출된 후 병합되도록 반환하는 것입니다.

- 클로저는 함수가 자신을 포함하는 외부 스코프에 접근할 수 있는 경우 즉, 함수가 선언될 당시의 외부 lexical environment를 참조할 수 있는 것을 말합니다.


학습 단계로 잘못된 정보가 있을 수 있습니다. 잘못된 부분에 대해 알려주시면 정정하도록 하겠습니다.

참고 : https://ko.javascript.info/currying-partialshttps://mangkyu.tistory.com/102

https://velog.io/@goatyeonje/JavaScript-%EB%A0%89%EC%8B%9C%EC%BB%AC-%ED%99%98%EA%B2%BD%EA%B3%BC-%ED%81%B4%EB%A1%9C%EC%A0%80

https://minisiri.tistory.com/35