본문 바로가기

Front-end/JavaScript

[모던 JavaScript 튜토리얼] 2.2 코드 구조

모던 JavaScript 튜토리얼을 읽고 정리하였습니다.

이 파트에서 배우는 것은 코드 블록을 만드는 방법이다.

문(statement)

문은 어떤 작업을 수행하는 문법 구조(syntax structure)와 명령어(command)를 의미한다. 서로 다른 문은 세미콜론으로 구분한다. 

alert('Hello');
alert('World');

세미콜론

줄바꿈이 있다면 세미콜론을 생략할 수도 있다.

alert('Hello')
alert('World')

자바스크립트는 줄 바꿈이 있으면 이를 암시적 세미콜론으로 해석한다. 이런 동작 방식을 세미콜론 자동 삽입(automatic semicolon insertion)이라 부른다.

 

그런데 아래와 같이 줄바꿈이 세미콜론을 의미하지 않는 경우도 있는데, 이때에는 자동 삽입이 일어나지 않는다. 어떤 줄이 +로 끝나면 그 줄은 불완전한 표현식으로 인식되어 세미콜론이 붙지않는다.

 

어떤 경우에는 세미콜론이 필요한데, 자바스크립트가 이를 추정하지 못하는 상황도 존재한다. 다음과 같이 세미콜론 없이 문을 작성한 경우를 가정해보자.이 예제를 실행하면 첫번째 줄만 실행되고 두번째 줄만 실행되지 않는다. 그 이유는 자바스크립트는 대괄호 앞에 세미콜론이 있다고 가정하지 않기 때문이다. 따라서 줄바꿈으로 문을 나누더라도 세미콜론을 넣는 것이 좋다. 

alert("에러가 발생합니다.")
[1, 2].forEach(alert)

주석

주석은 스크립트 어느 곳에나 작성할 수 있다. 자바스크립트 엔진은 주석을 무시하므로 주석의 위치는 실행에 영향을 주지 않는다.

  • 한 줄짜리 주석은 //로 시작된다.
// 이 주석은 한 줄을 다 차지합니다.
  • 여러 줄의 주석은 /* 와 */ 사이에 둔다.
/* 두 줄짜리 주석 예제
이것은 여러 줄의 주석입니다.
*/

중첩 주석은 지원하지 않으므로 /* ... */ 안에 또 다른 /* ... */ 이 있을 수가 없다.

주석을 중첩해 쓰면 에러가 발생한다.

/*
  /* 중첩 주석 ?!? */
*/