[JS] IIFE(즉시 호출 함수 표현식)

Hailey·2022년 7월 26일
0

함수 선언과 함수 표현식

  • 함수 선언(declaration)은 미리 자바 스크립트의 실행 컨텍스트(execution context)에 로딩 되어 있으므로 언제든지 호출할 수 있지만, 표현식(Expression)은 인터프리터가 해당 라인에 도달 하였을때만 실행이 됩니다.
  • 함수 선언(declaration)을 조건(conditionally)에 따라 할당(assignment)하거나, 생성, 또는 괄호 연산자로 그루핑(grouping)하여 표현식으로 나타낼 수 있습니다. 다음 소스는 함수 정의(선언과 표현)의 차이를 간단히 보여주고 있습니다.
foo(); // success!
function foo() {
    alert('foo');
}
foo(); // "foo" is not defined.
var foo = function() {
    alert('foo');
};
alert(foo); // "foo" is not defined.
(function foo () {});
alert(foo); // "foo" is not defined.

IIFE(Immediately Invoked Function Expressions: ‘Iffy’)

  • 전역 영역을 오염 시키지 않기 위해 사용 → IIFE 에서 생성된 변수와 함수의 이름은 전역 Scope와 충돌하지 않습니다. (이를 오염시키지 않는다고도 말합니다.)
  • closure와 함께 private data를 사용할 수 있습니다.
    (function() {
        console.log("I am IIFE");
    }());
    
    // Variation 1 => 널리 활용
    (function() {
        console.log("I am IIFE");
    })();
    
    ---
    
    (() => console.log('IIFE with arrow'))();
    
    (() => {
        console.log('IIFE with arrow')
    })()
    // All the code is wrapped in the IIFE
    (function () {
        var firstName = “Richard”;
        function init () {
            doStuff (firstName);
            // code to start the application
        }
        function doStuff () {
            // Do stuff here
        }
        function doMoreStuff () {
            // Do more stuff here
        }
        // Start the application
        init ();
    }) ();
profile
팀에서 꼭 필요한 프론트엔드 개발자가 되고 싶습니다.

0개의 댓글