IIFE에서 안전을 위한 세미콜론

이제 우리의 즉시 실행 함수가 앞에 더하기 기호 대신 원형 괄호로 둘러싸여 있다고 가정해 봅시다, 다음과 같이요:

(function() {
	console.log(1); // 1을 출력함
})();

변수 num가 함수 외부에서 정의되었다고 가정해 봅시다:

let num = 1; // 세미콜론이 있음

(function() {
	console.log(num); // 1을 출력함
})();

이제 우리가 세미콜론을 잊어버렸다고 가정해 봅시다:

let num = 1

(function() {
	console.log(num); //!! 오류를 발생시킴
})();

결과적으로, JavaScript가 우리의 함수를 첫 번째 줄 명령문의 연속으로 인식하기 때문에 이런 코드는 오류를 발생시킵니다.

이런 문제를 피하기 위해서는, 즉시 실행 함수 호출 앞에는 항상 세미콜론을 넣어야 합니다, 다음과 같이요:

let num = 1

;(function() {
	console.log(num); // 1을 출력함
})();

이 문제가 다소 인위적으로 보일 수 있습니다. 사실 그렇지 않습니다. 여러분의 페이지에 별도의 파일에서 여러 스크립트가 포함될 수 있는 상황이 있을 수 있습니다. 이 경우 하나의 파일 끝에 세미콜론이 누락될 수 있고, 두 번째 파일이 즉시 실행 함수 호출로 시작한다면 이는 자동적으로 문제를 일으킬 것입니다.

따라서, 현재 문제가 없을 것이라고 확신하더라도, 즉시 실행 함수 호출 앞에는 항상, 항상 세미콜론을 넣으세요. 문제는 나중에 발생할 수 있습니다.

위에서 말한 내용을 적용하고, 앞에 세미콜론을 넣어 즉시 실행 함수를 호출해 봅시다:

;(function() {
	console.log(1); // 1을 출력함
})();

코드를 실행하지 말고, 콘솔에 무엇이 출력될지 결정하세요:

let str = 'str';

(function() {
	console.log(1);
})();

코드를 실행하지 말고, 콘솔에 무엇이 출력될지 결정하세요:

let str = 'str'

(function() {
	console.log(1);
})();