JavaScript

[JavaScript] 커링(Currying) 이란? const fn = x => y => x + y;

2025. 3. 2. 18:07
목차
  1. 1. 함수 구조
  2. 2. 동작 원리
  3. 3. 사용 예시
  4. 4. 활용 예시: 커링의 장점

1. 함수 구조

const fn = x => y => x + y;

const fn = function(x) {
    return function(y) {
        return x + y;
    };
};

위는 커링(Currying) 기법을 사용한 함수 표현식이다. 커링은 여러 개의 인수를 받는 함수를 하나의 인수를 받는 함수들의 연속으로 변환하는 기법이다.

2. 동작 원리

  • fn 함수는 첫 번째 인수 x를 받아서, 또 다른 함수를 반환한다.
  • 반환된 함수는 두 번째 인수 y를 받아서 x + y를 계산하고 결과를 반환한다.

3. 사용 예시

const add5 = fn(5); // x에 5를 넣음
console.log(add5(3)); // y에 3을 넣음 -> 5 + 3 = 8

console.log(fn(2)(4)); // x에 2, y에 4 -> 2 + 4 = 6
  • fn(5)를 호출하면 y => 5 + y와 같은 함수가 반환된다.
  • 이후 반환된 함수에 3을 넣으면 5 + 3 = 8이 된다.

4. 활용 예시: 커링의 장점

const add10 = fn(10);
console.log(add10(7)); // 17
console.log(add10(20)); // 30

add10 함수는 항상 10을 더하는 역할을 해. 따라서 반복적인 작업을 단순화할 수 있다.

 

참고 : https://ko.javascript.info/currying-partials 

 

커링

 

ko.javascript.info

function curry(f) {
  return function(a) { // 첫 번째 래퍼 함수
    return function(b) { // 두 번째 래퍼 함수
      return f(a, b); // 원래 함수 f를 a와 b로 호출
    };
  };
}

f의 두 개의 인수를 커링하는 헬퍼 함수 curry(f)를 생성한다. 다른 말로 하면, f(a, b)처럼 두 개의 인수를 요구하는 함수를 f(a)(b) 형식으로 변환하는 curry(f)라는 함수를 만드는 것이다.

 

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

let curriedSum = curry(sum);

curriedSum은 이제 커링된 sum 함수이다.

 

alert(curriedSum(1)(2)); // 3

🔍 이 호출을 자세히 풀어보면

 

1. curriedSum(1)을 호출하면

function(b) {
  return f(1, b);
}

이 새로운 함수가 반환된다. 여기서 a = 1이다.

2. curriedSum(1)(2)는 이제 

f(1, 2);

즉, sum(1, 2)와 같다.

3. sum(1, 2)는 1 + 2 = 3을 반환 한다.

'JavaScript' 카테고리의 다른 글

[namo CROSSEDITOR] Script인증을 사용할 경우에는 UploadFileExecutePath API를 설정해 주세요.  (1) 2025.04.29
[JavaScript] 전역 객체 프로퍼티  (0) 2025.02.15
[JavaScript] 13. 스코프란?  (0) 2025.02.15
[JavaScript] Invalid left-hand side expression in prefix operation, Number( ) 함수에 연산자 적용 에러  (0) 2025.02.06
[JavaScript] 자바스크립트에서 && 연산자의 동작 방식  (0) 2025.01.30
  1. 1. 함수 구조
  2. 2. 동작 원리
  3. 3. 사용 예시
  4. 4. 활용 예시: 커링의 장점
'JavaScript' 카테고리의 다른 글
  • [namo CROSSEDITOR] Script인증을 사용할 경우에는 UploadFileExecutePath API를 설정해 주세요.
  • [JavaScript] 전역 객체 프로퍼티
  • [JavaScript] 13. 스코프란?
  • [JavaScript] Invalid left-hand side expression in prefix operation, Number( ) 함수에 연산자 적용 에러
돌맹이떼굴떼굴
돌맹이떼굴떼굴
돌맹이떼굴떼굴
떼굴떼굴개발자
돌맹이떼굴떼굴
전체
오늘
어제
  • 분류 전체보기 (139)
    • C언어 (6)
      • 홍정모 C언어 (6)
    • 자바 (24)
      • 자바의 정석 Ch.7 객체지향 프로그래밍 II (22)
      • 이것이 자바다 (1)
    • 스프링의 정석 (38)
      • Ch. 02 Spring MVC (34)
      • Ch. 03 Spring DI와 AOP (1)
      • spring error (2)
    • JavaScript (7)
    • HTML&CSS (2)
      • 제대로 파는 HTML CSS - by 얄코 (1)
    • React.js, 스프링 부트, AWS로 배우는 .. (12)
    • BACKJOON, 백준 (7)
    • 프로그래머스 (1)
    • Error (10)
      • Java (5)
    • Spring (5)
    • 자료구조 (1)
    • JPA (2)
    • Vue (1)
    • Git (5)
    • Linux (0)
    • HTML (1)
    • DB (3)
    • Web (2)
    • 잡다 (1)
    • 개발 프로젝트 (2)
    • doom (1)
    • 취업 (3)
    • Network (0)
    • 재테크 (2)
    • 일상 (2)

블로그 메뉴

  • 홈
  • 태그
  • 방명록

공지사항

인기 글

태그

  • 비맥스
  • 비맥스메타
  • 비전공
  • 비전공개발자
  • 보령약국
  • kosa혜화
  • 이직확인서
  • 비맥스메타정
  • KOSA
  • 향기부각로션
  • 세타필로션
  • 비맥스가격
  • 갈더마
  • 종로5가약국
  • 세타필세라마이드로션
  • 향기지속로션
  • 온유약국
  • 취업연계
  • 애크논크림
  • 고보습로션

최근 댓글

최근 글

hELLO · Designed By 정상우.
돌맹이떼굴떼굴
[JavaScript] 커링(Currying) 이란? const fn = x => y => x + y;
상단으로

티스토리툴바

단축키

내 블로그

내 블로그 - 관리자 홈 전환
Q
Q
새 글 쓰기
W
W

블로그 게시글

글 수정 (권한 있는 경우)
E
E
댓글 영역으로 이동
C
C

모든 영역

이 페이지의 URL 복사
S
S
맨 위로 이동
T
T
티스토리 홈 이동
H
H
단축키 안내
Shift + /
⇧ + /

* 단축키는 한글/영문 대소문자로 이용 가능하며, 티스토리 기본 도메인에서만 동작합니다.