Javascript Stuty
- javascript 함수 선언문, 함수 표현식 에서의 세미콜론
function statement (함수 선언문)와 function expression(함수 표현식)에서 세미콜론
일반적으로 자바스크립트 코드를 작성할 대 함수 선언문 방식으로 선언된 함수의 경우는 함수 끝에 세미콜론(;)을 붙이지 않지만, 함수 표현식 방식의 경우 세미콜론(;)을 붙이는 것을 권장한다.
ex)
// 함수 선언문 방식
function add(x, y){
return x+y;
}
// 함수 끝에 세미콜론을 붙이지 않는다.
// 함수 표현식 방식
var add = function sum(x,y){
return x+y;
};
// 함수 끝에 세미콜론을 붙이도록 한다.
자바스크립트는 세미콜론 사용을 강제하지는 않는다. 자바스크립트 인터프리터가 자동으로 세미콜론을 삽입시켜 주기 때문이다.
그렇다고 해서 세미콜론 사용을 신경 쓰지 않으면 디버깅 상황에서 애먹을 수 있다.
ex)
// 함수 표현식 방식에 ;를 안 붙인 경우 이후 바로 즉시 실행 함수가 오는 경우.
var func = function(){
return 1;
} //세미콜론 사용하지 않음.
(function() {
console.log("test");
})();
이 코드를 통해 func()함수를 호출하면 의도와는 다르게 'number is not a function'이라는 에러가 발생한다.
그 이유는 자바스크립트 파서가 func()의 함수 정의에서 세미콜론을 사용하지 않아, return 42; 문장을 지나 func() 함수 정의 끝에있는 중괄호 (}) 만으로 함수가 끝났다고 판단하지 않기 때문이다.
그리고 자바스크립트 파서는 이후 괄호에 두러싸여 정의된 즉시 실행함수를 보고 이를 마치 func()함수 호출 연산으로 생각한다. 즉 func()함수 호출 후 42가 반환되고 42();형태로 또다시 함수를 호출하려 시도한다. 그러나 42는 숫자이지 함수가 아니므로 'number is not a function' 에러가 발생한다.
어려운 설명이지만 이러한 문제가 발생할 수 있다는 것이다. 많은 자바스크립트 가이드에서 함수 표현식 방식에서의 세미콜론 사용을 강력 히 권고한다.
