Ted's Codding study

IIFE 즉시 실행 함수 표현 (Immediately Invoked Function Expression) 본문

JavaScript

IIFE 즉시 실행 함수 표현 (Immediately Invoked Function Expression)

Ted93 2024. 5. 3. 09:55

IIFE 정의

1) 정의되자마자 즉시 호출(실행)되는 함수
2)주로 변수의 스코프(변수가 유효한 범위, 지역)를 제한하여 전역 스코프의 오염을 방지하는 데 사용
3) 전역 변수는 코드 어디에서나 접근 가능하기 때문에 의도치 않은 변경이 발생 가능
4) 이를 방지하기 위한 하나의 기법이 IIFE

 

IIFE의 대표적 형태

  • (function() {})(); // 익명함수를 생성하고 즉시 호출
  • 정의된 직후 자동으로 실행되는 함수 - 초기화 코드 실행이 필요할 때 유용하게 사용
  • 전역 스코프에 영향을 주지 않으면서 필요한 코드를 실행 가능

즉시 호출 함수를 사용한 이름 충돌 문제 해결

let commonVar = '전역 변수';
console.log(commonVar);
(function () {
  let commonVar = 'IIFE 내부 변수';
  console.log(commonVar);
})();
console.log(commonVar);

Immediately-Invoked-Function-Expression

  • 제일 아래 콘솔인 (console.log(commonVar); 에서  전역 변수가 호출되는 것을 확인
    → IIFE는 전역 스코프에 영향을 주지 않음
  • 일반적으로 함수는 호출하는 곳에서 실행이 되지만, IIFE는 즉시 실행을 함, 그래서 출력의 순서가 전역 변수에 작성된 것 처럼 순차적으로 실행이 됨

  • 만약 IIFE를 사용하지 않았으면 commonVar에는 아래와 같은 에러를 만날 것임

Immediately-Invoked-Function-Expression2

 

😁 자주 쓰지 않지만 기술 면접에서 물어볼 수 있으니, 이번 기회에 저의 정리가 되셨으면 좋겠습니다 ^^

 

노션으로 보고 싶다면?

https://short-echidna-b16.notion.site/IIFE-Immediately-Invoked-Function-Expression-1954eb3cc07f4909ac2acc5e5fc24436?pvs=4

 

IIFE 즉시 실행 함수 표현 (Immediately Invoked Function Expression) | Notion

IIFE 정의

short-echidna-b16.notion.site