javaScript. IIFE(즉시 호출 함수 표현식)

IIFE

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

선언하자마자 즉시 실행되는 Javascript Function 를 말한다.

다른 말로 모듈 패턴(Module Pattern)이라고도 함.

 

---

 

SYNTAX

(function () {
    statements
})();

( function() {} )();

 

 

이는 Self-Executing Anonymous Function 으로 알려진 디자인 패턴이고 크게 두 부분으로 구성된다.

 

첫 번째는 괄호((), Grouping Operator)로 둘러싸인 익명함수(Anonymous Function)이다.

이는 전역 스코프에 불필요한 변수를 추가해서 오염시키는 것을 방지할 수 있을 뿐 아니라

IIFE 내부안으로 다른 변수들이 접근하는 것을 막을 수 있는 방법이다.

 

두 번째 부분은 즉시 실행 함수를 생성하는 괄호()이다.

이를 통해 자바스크립트 엔진은 함수를 즉시 해석해서 실행한다.

 

 

- 함수를 function() {}로 선언하면서

- ()를 붙여 호출하여 즉시 실행됨.

 

 

 

>> 라이브러리를 만들 때 기본인 구문이다.

 

비공개 변수가 없는 자바스크립트에 비굥개 변수 기능을 만들어주는 역할.

 

 

(function () {
    var aName = "Barry";
})();
// IIFE 내부에서 정의된 변수는 외부 범위에서 접근이 불가능하다.
aName // throws "Uncaught ReferenceError: aName is not defined"

 

IIFE 내부에서 정의된 변수인 aName은 밖에서 접근이 불가능하다.

그럼 IIFE문은 왜 쓰는걸까?

 

var result = (function () {
    var name = "Barry";
    return name;
})();
// 즉시 결과를 생성한다.
result; // "Barry"

 

위 예제처럼 var result에 IIFE문의 return값을 저장하고 실행하면,

IIFE 자체는 저장되지 않지만, 함수가 실행된 결과만 저장된다.

 

 

IIFE의 원리를 알기 위해서는 '실행 컨텍스트'에 대해서 알아야 한다.

다음 포스팅에서 실행 컨텍스트에 대해 작성하도록 하겠다.

 

 

---

 

REFERENCE

https://developer.mozilla.org/ko/docs/Glossary/IIFE

IIFE - 용어 사전 | MDN