자바스크립트 입문_커링함수(currying function)
자바스크립트 2021. 5. 9. 19:10(본 포스팅은 위키북스의 '코어자바스크립트' 책을 공부하면서 작성되었습니다_내돈내산)
- 커링함수
: 여러개의 인자를 받는 함수를 하나의 인자만 받는 함수로 나눠서 순차적으로 호출될 수 있게 체인 형태로 구성.
: 한번에 하나의 인자만 전달하는 것을 원칙으로 함.
: 중간 과정상의 함수를 실행한 결과는 그 다음 인자를 받기위해 대기만 할뿐, 마지막 인자가 전달되기 전까지는 원본 함수가 실행되지 않음.
let curry5 = function (func) {
return function (a){
return function (b){
return function (c){
return function (d){
return function (e){
return func(a,b,c,d,e)
};
};
};
};
};
};
let getMax = curry5(Math.max);
console.log(getMax(1)(2)(3)(4)(5));
- 위처럼 인자의 갯수를 하나씩 받아서 모든 인자의 갯수가 다 찼을때 함수를 실행해서 결과를 내보내도록 함.
- 하지만 인자가 많아질수록 들여쓰기의 정도가 올라가고, 가독성이 떨어지는 단점이 있음.
- 이를 ES6에서는 같은 내용을 한줄로 표기할 수 있음.
let curry5 = func =>a =>b =>c =>d =>e =>func(a,b,c,d,e);
- 화살표 순서에 따라 함수에 값을 차례로 넘겨주면 마지막에 func가 호출될거라는 흐름을 더 쉽게 이해할 수 있음.
- 각 단계에서 받은 인자들을 모두 마지막 단계에서 참조할 것이므로 GC되지 않고 메모리에 쌓였다가 마지막 호출로 실행 컨텍스트가 종료된 후에야 비로소 한꺼번에 GC의 수거대상이 됨.
커링함수는 지연실행(lazy execution)을 의도한 상황에서 적합한 사용예시를 보여줌. 함수의 매개변수가 항상 비슷하고 일부만 바뀌는 경우에도 적절하게 사용할 수 있음.
let getInformation = function (baseUrl) { // 서버에 요청할 주소의 기본 URL
return function (path) { // path 값
return function (id) { // id 값
return fetch(baseUrl + path + '/' + id); // 실제 서버에 정보를 요청
}
}
}
// ES6
let getInformation2 = baseUrl => path => id => fetch(baseUrl + path + '/' + id);
- HTML5의 fetch함수는 url을 받아 해당 url에 HTTP요청을 보냄. 보통 REST API를 이용할 경우 baseUrl은 몇 개로 고정되지만 나머지 path나 id값은 매우 많을 수 있음.
- 이러한 상황에서 서버에 정보를 요청할 때마다 매번 baseUrl부터 전부 기입하는것 보다, 공통적인 요소는 기억해두고 특정한 값만 으로 서버요청을 수행하는 함수를 만들어 두는 편이 개발 효율성이나 가독성 측면에서 더 좋음.
'자바스크립트' 카테고리의 다른 글
자바스크립트 입문_constructor 프로퍼티 (0) | 2021.05.19 |
---|---|
자바스크립트 입문_프로토타입(prototype) (0) | 2021.05.19 |
자바스크립트 입문_부분적용함수 구현 (0) | 2021.05.09 |
자바스크립트 입문_접근권한제어(정보은닉) (0) | 2021.05.09 |
자바스크립트 입문_콜백함수 내부에서 외부 데이터를 사용하고자 할때 (0) | 2021.05.09 |