📌 JavaScript에서의 1급 객체 (First-Class Function)

✅ 정의

JavaScript에서는 함수가 1급 객체(First-Class Citizen) 로 취급됩니다.
즉, 함수도 숫자나 문자열처럼 값처럼 다룰 수 있는 존재입니다.

✅ "값처럼 할당, 전달, 반환이 가능한 존재"

함수를 변수에 저장하거나, 인자로 전달하거나, 반환값으로 사용할 수 있다는 것이 핵심입니다.

📦 함수가 1급 객체인 3가지 핵심 특징

1. 변수에 할당할 수 있다

const add = function (a, b) {
  return a + b;
};

console.log(add(2, 3)); // 5

2. 함수의 인자로 전달할 수 있다 (콜백 함수의 기반)

function repeat(n, callback) {
  for (let i = 0; i < n; i++) {
    callback(i);
  }
}
repeat(3, console.log);
// 0
// 1
// 2

3. 함수의 반환값이 될 수 있다 (클로저, 고차 함수 구현 가능)

function makeAdder(x) {
  return function (y) {
    return x + y;
  };
}
const add5 = makeAdder(5);
console.log(add5(3)); // 8

🔁 연관 개념

🌀 클로저 (Closure)

내부 함수가 외부 함수의 변수에 접근하고 이를 기억하는 구조

함수가 반환된 이후에도 외부 변수의 값을 계속 "기억"할 수 있음

React에서 useEffect, 이벤트 핸들러, setTimeout 등에 사용 시 주의 필요

🔼 고차 함수 (Higher-Order Function)

함수를 인자로 받거나, 함수를 반환하는 함수

Array.map, filter, reduce 같은 고차 배열 메서드

withAuth(Component) 같은 HOC 패턴이나 커스텀 훅도 고차 함수 기반

🎯 면접 자주 출제 포인트

"JavaScript에서 함수는 왜 1급 객체인가요?"

• 1급 객체란, 변수에 할당, 함수의 인자(parameter)로 활용, 반환(return)값으로 사용될 수 있는 것을 의미합니다.
• JS에서 함수는 위 3가지 조건을 충족하기 때문에 문자열,숫자와 같이 1급 객체로 다뤄집니다.

"함수형 컴포넌트에서 클로저 문제는 왜 발생하고, 어떻게 해결하나요?"

• 함수형 컴포넌트는 랜더링 시점의 state, props를 클로저에 의해 고정됩니다.
• 비동기 요청시에 stale closure 문저가 발생할 수 있고 이는 useRef 혹은 함수형 업데이트 방식 setState(prev => ...)으로 해결할 수 있습니다.

🚀 왜 중요한가요?

JavaScript에서 함수가 1급 객체이기 때문에 콜백, 클로저, 고차 함수, 이벤트 핸들링, Hooks 등 다양한 패턴이 가능

React 함수형 컴포넌트의 동작 원리를 이해하기 위한 기초 체계

상태 관리, 비동기 처리, 최적화에서 발생하는 stale closure 문제 해결의 기반