Computer >> 컴퓨터 >  >> 프로그래밍 >> JavaScript

JavaScript에서 +function() {} 표기법의 의미와 즉시 실행 함수 완벽 정리

+function() {} 표기법이란 무엇인가?

JavaScript 코드를 보다 보면 함수 앞에 + 기호가 붙어 있는 형태를 종종 접하게 됩니다. +function() {} 표기법의 핵심 역할은 파서(parser)가 뒤따르는 코드를 표현식(expression)으로 해석하도록 강제하는 것입니다.

JavaScript에서 문장(statement)이 function 키워드로 시작하면 파서는 이를 함수 선언문으로 인식합니다. 하지만 앞에 + 같은 연산자가 붙으면 해당 코드는 값으로 평가되는 표현식이 되며, 그 결과로 함수를 즉시 호출할 수 있게 됩니다.

즉시 실행 함수(IIFE) 예제

이 표기법은 주로 즉시 실행 함수(Immediately Invoked Function Expression, IIFE)를 만들 때 사용됩니다. 다음 예제를 살펴보세요.

+function() { alert("Demo!"); }();

위 코드는 함수가 정의되는 즉시 실행되어 "Demo!"라는 알림창을 띄웁니다. 전역 스코프를 오염시키지 않고 독립적인 실행 환경을 만들고 싶을 때 유용하게 활용됩니다.

+ 외에 사용할 수 있는 다른 기호들

함수 앞에 붙일 수 있는 기호는 +만 있는 것은 아닙니다. 단항 연산자(unary operator)라면 모두 동일한 효과를 냅니다.

  • ! — 논리 NOT 연산자
  • - — 부정(negation) 연산자
  • ~ — 비트 NOT 연산자

예를 들어 다음과 같이 작성해도 같은 방식으로 동작합니다.

!function() { alert("Demo!"); }();

괄호를 활용한 대체 표기법

사실 가장 널리 쓰이는 IIFE 작성 방식은 괄호를 사용하는 것입니다. +나 다른 기호 없이도 표현식으로 해석되도록 만들 수 있습니다.

방법 1: 괄호로 전체를 감싸기

(function() { alert("Demo!"); })();

방법 2: 호출 괄호까지 함께 감싸기

(function() { alert("Demo!"); }());

두 방식 모두 결과는 동일하며, 개인적 또는 팀의 코딩 컨벤션에 따라 선호하는 스타일을 선택하면 됩니다. 일반적으로는 괄호를 사용한 방식이 의도를 더 명확하게 드러내므로 가독성 측면에서 권장됩니다.

정리

+function() {} 표기법은 파서가 함수를 표현식으로 해석하도록 강제하여 즉시 실행을 가능하게 하는 기법입니다. !, -, ~ 같은 다른 단항 연산자로도 대체할 수 있으며, 괄호를 사용하는 전통적인 IIFE 방식도 함께 알아두면 JavaScript 코드를 읽고 이해하는 데 큰 도움이 됩니다.