• 티스토리 홈
  • 프로필사진
    유니얼
  • 방명록
  • 공지사항
  • 태그
  • 블로그 관리
  • 글 작성
유니얼
  • 프로필사진
    유니얼
    • 분류 전체보기 (295)
      • Unity (17)
        • 게임 개발 (5)
      • Unreal (24)
        • 게임 개발 (20)
      • DirectX (36)
      • 코딩테스트 (91)
        • 프로그래머스 (25)
        • 백준 (66)
      • Google Workspace (1)
      • Programing (102)
        • C# (68)
        • C++ (24)
        • JavaScript (10)
      • 게임 서버 프로그래밍 (17)
      • Web (6)
        • 슈퍼코딩 (6)
  • 방문자 수
    • 전체:
    • 오늘:
    • 어제:
  • 최근 댓글
    등록된 댓글이 없습니다.
  • 최근 공지
    등록된 공지가 없습니다.
# Home
# 공지사항
#
# 태그
# 검색결과
# 방명록
  • [JavaScript] JavaScript의 일급 함수, 일급 시민, 고차 함수
    2024년 12월 26일
    • 유니얼
    • 작성자
    • 2024.12.26.: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의 이러한 특성을 이해하고, 적절히 활용하면 더욱 효율적이고 가독성 높은 코드를 작성할 수 있습니다. 함수를 단순히 코드 블록으로 보는 것이 아니라, 데이터를 다루는 유연한 도구로 활용해 보세요!

    반응형
    다음글
    다음 글이 없습니다.
    이전글
    이전 글이 없습니다.
    댓글
조회된 결과가 없습니다.
스킨 업데이트 안내
현재 이용하고 계신 스킨의 버전보다 더 높은 최신 버전이 감지 되었습니다. 최신버전 스킨 파일을 다운로드 받을 수 있는 페이지로 이동하시겠습니까?
("아니오" 를 선택할 시 30일 동안 최신 버전이 감지되어도 모달 창이 표시되지 않습니다.)
목차
표시할 목차가 없습니다.
    • 안녕하세요
    • 감사해요
    • 잘있어요

    티스토리툴바