자바스크립트 즉시 실행 함수

즉시 실행 함수의 개념과 사용 이유

"즉시 실행 함수"란
함수를 정의하자마자 즉시 실행되는 함수 표현식을 의미합니다.
이 기법은 변수 호이스팅과 스코프 오염을 방지하기 위해 사용되며, 함수 블록 내에서 코드를 작성할 때 유용합니다. 함수는 정의와 동시에 실행되며, 주로 브라우저 컴파일러에 의해 함수가 로드된 직후에 호출됩니다.

 

자바스크립트에서 함수는 큰 특징이 있습니다.

• 함수 블록(혹은 '함수 바디'라고도 함) 내에 선언한 변수는 변수의 스코프가 함수 블록 내에서만 유효하다.
• 함수는 원하는 위치에서 호출하여 실행할 수 있다.

함수를 정의하고 함수 (블록 혹은 바디) 안에 변수를 선언하고 이 정의한 함수를 즉시 실행하도록 하면, 함수 안에 선언한 변수는 변수의 스코프가 함수 안에서만 유효하니 이 골치 아픈 스코프의 문제를 해결할 수 있다는 것에 착안한 것입니다. 이 코딩 기법이 "즉시 실행 함수" 표현식입니다.

 

즉시 실행 함수의 예제

(function() { // 즉시 실행 함수
    let a = 1;
    let b = 2;
    let c = a + b;
    console.log(c);
})();

let a = 2; // 즉시 실행 함수의 변수 a와 충돌이 발생하지 않음

 

즉시 실행 함수란 변수 호이스팅을 방지하고 스코프의 오염을 방지하기 위해 함수의 특징을 활용하여 함수 블로 내에서 코딩하는 기법으로, 정의되자마자 즉시 실행되는(브라우저 컴파일러에 함수가 로드된 후 직접 호출되는) 함수 표현식을 의미합니다.

그룹 연산자 ()를 이용하는 방법

(function fn() {
    /* code */ 
}());

(function fn() {
    /* code */ 
})();

단항 연산자의 특징을 이용하는 방법

!function fn() {
    /* code */ 
}();

+function fn() {
    /* code */ 
}();

-function fn() {
    /* code */ 
}();

 

참고문헌

코딩에브리바디: 자바스크립트 즉시 실행 함수 – 쓰는 이유

자바스크립트 즉시 실행 함수 – 쓰는 이유 - 코딩에브리바디

 

codingeverybody.jp - JavaScript 即時実行関数

 

codingCourses: JavaScript Immediately Invoked Function Expressions (IIFEs)