[JavaScript] 즉시 실행 함수(IIFE)

즉시 실행 함수

즉시 실행 함수(IIFE)는 선언과 동시에 호출되는 함수. 이 패턴은 전역 범위 오염 방지와 함께 필요 작업 수행. 호출 후 즉시 콜스택에서 제거되어 코드 충돌 위험 감소.

프레임워크와 모듈 시스템의 발전으로 IIFE 사용 감소

IIFE 기본 형태

(function() {
    // 코드
})();

함수 선언과 동시에 호출하는 구조

사용 시기

• 전역 범위 오염 방지를 위해 사용
• 코드를 한 번만 실행하고 재호출이 불필요한 경우에 유용

특징

• 한 번 실행된 코드는 재호출 불가
  • 호출과 동시에 삭제되어 재사용 불가

IIFE 간단한 예제

(function test() {
  console.log("이 함수는 즉시 실행됨!");
})();

// 익명 함수 형태
(function() {
  console.log("이 함수는 즉시 실행됨!");
})();

// 화살표 함수 형태
(() => {
  console.log("이 함수는 즉시 실행됨!");
})();

위 코드에서 함수가 정의됨과 동시에 호출. 콘솔에는 "이 함수는 즉시 실행됨!"이라는 메시지 출력.

라이브러리에서 IIFE 사용 예시

여러 JavaScript 라이브러리들이 전역 스코프 보호를 위해 IIFE 패턴 활용. 예를 들어, 내부 변수나 함수를 외부에서 접근 못하게 하는 데 유용.

IIFE를 이용한 카운터 예제

// 일반적인 방식
let counter = 0;
function incrementCounter() {
  counter++;
  console.log(counter);
}

// IIFE를 사용한 방식
const counter = (function() {
  let count = 0; // 지역 변수로 보호됨
  return function() {
    count++;
    console.log(count);
  };
})();

counter(); // 1
counter(); // 2

위 예제에서는 IIFE를 사용해 count 변수가 전역 스코프에 노출되지 않도록 처리. 이렇게 하면 count 변수는 외부에서 접근 불가능하고, 클로저(closure)를 통해 안전하게 관리. 이는 변수 오염 방지와 코드의 안전성 향상.