[JS Tutorial] 세미콜론

세미콜론

한 줄의 끝에 위치한 세미콜론은 문(statement)의 끝을 나타낸다.한 줄에 있는 여러 문을 분리할 필요가 있을 때에만 반드시 필요하다.하지만, 어떤 사람은 각 문의 끝에 세미콜론을 넣는 것이 좋은 습관이라 믿는다. 언제 세미콜론을 넣고 언제 넣으면 안되는지에 대한 다른 규칙이 있다. 

 

1. 필요: 같은 줄 내에 두 개의 문이 포함되어있을 때

var i = 0; i++        // <-- semicolon obligatory
                      //     (but optional before newline)
var i = 0             // <-- semicolon optional
    i++               // <-- semicolon optional

 

2. 선택: 문의 마지막

자바스크립트에서 세미콜론은 문들을 분리하기 위해서 사용된다.

하지만 줄바꿈(line break)되거나 한 {블럭} 안에 오직 하나의 문만 있을 경우에는 생략(omitted)될 수 있다. 

문(statement)이라는 것은 컴퓨터로 하여금 무언가를 하도록하는 한 조각의 코드다. 

 

* 아래에 가장 흔한 문의 타입들을 정리해보았다. 

이 모든 문들은 세미콜론으로 끝나지만 꼭 그럴 필요는 없다. 

다만, 항상 문들을 세미콜론으로 끝나도록 한다면 줄바꿈을 없애더라도 같은 줄 안에서 문들이 분리되지 않아 문제가 발생할 걱정은 없다. 

var i;                        // variable declaration
i = 5;                        // value assignment
i = i + 1;                    // value assignment
i++;                          // same as above
var x = 9;                    // declaration & assignment
var fun = function() {...};   // var decl., assignmt, and func. defin.
alert("hi");                  // function call

 

* 주의할 점

(1) 중괄호(curly bracket)를 닫은 뒤에는 세미콜론을 붙이면 안된다. 유일한 예외가 있는데, var obj = {}; 과 같은 할당문(assignment statements)에서는 세미콜론을 붙여야 한다. 

// NO semicolons after }:
if  (...) {...} else {...}
for (...) {...}
while (...) {...}

// BUT:
do {...} while (...);

// function statement: 
function (arg) { /*do this*/ } // NO semicolon after }

 

(2) if, for, while 혹은 switch문의 소괄호(round bracket) 뒤일 경우

if문의 중괄호 뒤에 세미콜론을 붙이는 것은 아무 문제가 없다. 하지만 if, for, while 그리고 switch 문의 중괄호 뒤에 세미콜론을 붙이는 것은 추천하지 않는 방법이다. 

 

이 코드는 "hi"를 경고할 것이다. 하지만 이것은 0이 1과 같기 때문이 아니라 세미콜론 때문이다. 이러한 경우에 세미콜론을 붙이면, 자바스크립트는 세미콜론으로 인해 아무 문도 입력되지 않은 것으로, 그리고 if의 조건에 아무것도 속하지 것으로 인식할 것이고 따라서 if문에 입력한 것을 if와는 독립된 내용이라고 인식할 것이다. 

if (0 === 1); { alert("hi") }

// equivalent to:

if (0 === 1) /*do nothing*/ ;
alert ("hi");

 

* 자바스크립트의 오타를 고치는 방법

자바스크립트의 구문(syntax)을 교정(proofing)하는 도구로 JSLint 등이 있다. 

이를 사용하면 조금 더 쉽게 자바스크립트 구문을 교정할 수 있다.