[자바스크립트] IIFE

IIFE란 정의와 동시에 즉시 실행되는 함수를 의미합니다.
Immediately Invoked Function Expression (즉시 실행되는 함수 표현식) 의 약자입니다.

1. 즉시 실행 함수 표현식

즉시 실행 함수는 함수 리터럴을 ()로 감싼 뒤 바로 실행하는 형태가 일반적입니다.

(function () { console.log('Hello World') })(); // Hello World

2. IIFE 사용 이유

1) 필요없는 전역 변수의 생성을 줄일 수 있다.
함수를 생성하면 그 함수는 전역 변수로써 남아있게 되고, 많은 변수의 생성은 전역 스코프를 오염시킬 수 있다.
IIFE를 선언하면 내부 변수가 전역으로 저장되지 않기 때문에 전역 스코프의 오염을 줄일 수 있다.

2) private한 변수를 만들 수 있다.
IIFE는 외부에서 접근할 수 없는 자체적인 스코프를 가지게 된다. 이는 클로저의 사용 목적과도 비슷하며 내부 변수를 외부로부터 private하게 보호할 수 있다는 장점이 있다.

3. 활용 방안

1) 단 한 번의 사용이 필요한 함수

IIFE는 한 번의 실행 이후 없어지기 때문에 단 한번의 사용이 필요한 함수에 사용된다.
대표적인 예시로는 변수를 초기화하는 함수가 있다.

let isAdult;

(function init(age) {
  let currentAge = age;
  if (age >= 20) {
    isAdult = true;
  } else {
    isAdult = false;
  }
})(20);

console.log(isAdult); // true

2) 자바스크립트 모듈 패턴

자바스크립트 모듈을 만들 때에도 IIFE가 많이 활용된다.

const Counter = (function counterIIFE() {
  let current = 0;
  
  return {
    getCurrentValue: function () {
      return current;
    },
    
    increaseValue: function () {
      current = current + 1;
      return current;
    },
    
    decreaseValue: function () {
      current = current - 1;
      return current;
    },
  };
})();

console.log(Counter.getCurrentValue()); // 0
console.log(Counter.increaseValue()); // 1
console.log(Counter.decreaseValue()); // 0