JavaScript 2.2

코드 구조

• 코드 블록을 만드는 방법

문

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

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

alert('Hello'); //가독성을 높이기 위해 각 문은 서로 다른 줄에 작성하는 것이 일반적이다.
alert('World');

세미콜론

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

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

• 자바스크립트는 줄 바꿈이 있으면 이를 암시적 세미콜론으로 해석한다.
  • 이런 동작 방식을 세미콜론 자동 삽입이라고 부른다.
  • 대부분의 경우, 줄 바꿈은 세미콜론을 의미한다.
    • 하지만 대부분의 경우가 항상을 의미하진 않는다.
• 아래와 같이 줄 바꿈이 세미콜론을 의미하지 않는 경우도 있다.

alert(3 +
1
+ 2);

• 세미콜론 자동 삽입이 일어나지 않았기 때문에 6이 출력된다
  • 어떤 줄이 +로 끝나면 그 줄은 불완전한 표현식이미로 세미콜론이 필요하지 않다
• 반면 세미콜론이 정말로 필요하지만 자바스크립트가 이를 추정하지 못하는 상황도 존재한다.

에러 예제

• 자바 스크립트가 세미콜론을 자동으로 삽입해주지 못하는 구체적인 상황은 다음과 같다

[1, 2].forEach(alert)

• 코드를 실행하면 결과가 1과 2가 출력된다.

alert("에러가 발생합니다.")

[1, 2].forEach(alert)

• 코드를 실행하면 새롭게 추가된 alert만 제대로 출력되고 에러가 발생하는 것을 확인할 수 있다.

alert("제대로 동작합니다.");

[1, 2].forEach(alert)

• 코드를 실행하면 alert와 1, 2가 출력된다.
• 세미콜론이 없을 때 에러가 발생했던 이유는 자바스크립트가 대괄호 앞에는 세미콜론이 있다고 가정하지 않았기 때문이다.
  • 따라서 세미콜론 자동 삽입이 일어나지 않고 첫번째 예제는 단일문으로 처리된다.

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

• 문이 잘못 합쳐지면서 에러가 발생한다.

• 고로 줄 바꿈으로 문을 나눠놨더라도 문 사이에는 세미콜론을 넣는 것이 좋다.

  • 즉, 세미콜론은 생략할 수 있지만 사용하는 것이 더 안전하다.

주석

• 주석은 스크립트의 어느 곳에나 작성할 수 있다.
  • 자바 스크립트 엔진은 주석을 무시하기 때문에 주석의 위치는 실행에 영향을 주지 않는다.
  • 한줄짜리 주석은 // 로 시작된다.
  • 여러 줄의 주석은 슬래시 별표를 사용한다.
  • 주석의 내용은 무시된다.
    • 주석 안의 코드는 실행되지 않는다.
    • 이를 이용하면 코드 일부를 일시적으로 비활성화 할 수 있다.

// 한줄짜리 주석
// 이 주석은 한 줄을 다 차지합니다.
alert('Hello');

alert('World'); // 이 주석은 문 다음 이어집니다.

/* 두 줄짜리 주석 예제
이것은 여러 줄의 주석입니다.
*/
alert('Hello');
alert('World');

/* 코드 주석 처리하기
alert('Hello');
*/
alert('World');

• 중첩 주석은 지원하지 않는다.

• 단축키(맥)

  • 컨트롤(커맨드) + / : 해당 줄의 코드를 한 줄 짜리 주석으로 처리

  • 컨트롤(커맨드) + 쉬프트(옵션) + / : 여러 줄의 주석