Programing/JavaScript

[JavaScript] JavaScript의 일급 함수, 일급 시민, 고차 함수

유니얼 2024. 12. 26. 01:37
728x90

JavaScript는 일급 함수(First-Class Function)를 지원하는 언어로, 함수가 값처럼 취급됩니다. 이 특성 덕분에 고차 함수와 같은 강력한 프로그래밍 기법을 사용할 수 있습니다. 이 글에서는 일급 함수, 일급 시민, 고차 함수의 개념과 JavaScript에서의 활용 사례를 소개합니다.

1. 일급 시민(First-Class Citizen)

일급 시민(First-Class Citizen)이란, 함수가 다른 값과 동일하게 취급될 수 있는 프로그래밍 언어의 특성을 말합니다. JavaScript에서는 다음과 같은 작업이 가능합니다:

  1. 변수에 할당: 함수는 변수에 저장될 수 있습니다.
  2. 함수의 인자로 전달: 함수는 다른 함수에 인자로 전달될 수 있습니다.
  3. 함수의 반환값으로 사용: 함수는 다른 함수에서 반환될 수 있습니다.

예제

// 1. 변수에 할당
const greet = function () {
    console.log('Hello, World!');
};
greet(); // Hello, World!

// 2. 함수의 인자로 전달
const runFunction = function (fn) {
    fn();
};
runFunction(greet); // Hello, World!

// 3. 함수의 반환값으로 사용
const createMultiplier = function (multiplier) {
    return function (value) {
        return value * multiplier;
    };
};
const double = createMultiplier(2);
console.log(double(5)); // 10

2. 일급 함수(First-Class Function)

JavaScript에서 함수는 값처럼 취급되므로, 일급 함수의 특성을 가집니다:

  1. 함수를 인자로 전달 가능: 다른 함수에 전달되어 실행될 수 있습니다.
  2. 함수를 반환 가능: 다른 함수의 결과값으로 반환될 수 있습니다.

예제: 클로저(Closure)를 활용한 상태 유지

const passengerBooking = function () {
    let passengerCount = 0; // 상태 유지
    return function () {
        passengerCount++;
        console.log('Passenger Count:', passengerCount);
    };
};

const booker = passengerBooking();
booker(); // Passenger Count: 1
booker(); // Passenger Count: 2
booker(); // Passenger Count: 3

 

위 코드에서 반환된 함수는 외부 함수의 passengerCount를 참조하며, 이를 클로저라고 합니다.

3. 고차 함수(Higher-Order Function)

고차 함수(Higher-Order Function)는 다음 중 하나를 만족하는 함수입니다:

  1. 다른 함수를 인자로 받는 함수.
  2. 다른 함수를 반환하는 함수.

3-1. 함수를 인자로 전달

const withLogging = function (fn) {
    return function (...args) {
        console.log(`Called with arguments: ${args}`);
        return fn(...args);
    };
};

const add = (a, b) => a + b;
const loggedAdd = withLogging(add);

console.log(loggedAdd(2, 3)); // Called with arguments: 2,3
                              // 5

3-2. 함수를 반환

const multiplier = function (factor) {
    return function (number) {
        return number * factor;
    };
};

const triple = multiplier(3);
console.log(triple(4)); // 12

4. 콜백 함수(Callback Function)

콜백 함수(Callback Function)는 다른 함수에 인자로 전달되어 실행되는 함수를 말합니다. 이는 특히 비동기 프로그래밍에서 유용합니다.

 

예제

const processUserInput = function (callback) {
    const name = 'Alice';
    callback(name);
};

processUserInput(function (name) {
    console.log(`Hello, ${name}!`);
});
// Hello, Alice!

 

콜백 함수는 비동기 작업(예: 이벤트 처리, 타이머, 네트워크 요청 등)에서 자주 사용됩니다.

5. 요약

개념 설명 예시
일급 시민 함수가 값처럼 취급되며, 변수에 할당, 인자로 전달, 반환 가능. const fn = () => {};
일급 함수 함수가 다른 함수의 인자로 전달되거나 반환값으로 사용 가능. function outer() { return inner; }
고차 함수 함수를 인자로 받거나 함수를 반환하는 함수. array.map(fn)
콜백 함수 다른 함수에 인자로 전달되어 실행되는 함수. setTimeout(() => {}, 1000)

6. 결론

JavaScript에서 일급 함수와 고차 함수의 개념은 언어의 유연성과 강력함을 보여줍니다. 이를 통해 함수형 프로그래밍 패턴을 구현하거나, 비동기 작업을 효율적으로 처리할 수 있습니다. JavaScript의 이러한 특성을 이해하고, 적절히 활용하면 더욱 효율적이고 가독성 높은 코드를 작성할 수 있습니다. 함수를 단순히 코드 블록으로 보는 것이 아니라, 데이터를 다루는 유연한 도구로 활용해 보세요!

반응형