자바스크립트 기본 - 코드의 구조

devheyrin·2022년 4월 12일
0

modern javascript

목록 보기
2/26

statement

statement(선언, 문)는 어떤 작업을 수행하는 문법구조와 명령어를 의미한다.

alert("Hello, world!"); 가 하나의 statement 라고 할 수 있다.

서로 다른 statement는 세미콜론으로 구분된다.

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

세미콜론으로 구분하면 한 줄에 여러 개의 statement 를 작성할 수 있지만, 가독성을 위해 여러 줄로 나누어 작성한다.

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

세미콜론

줄 바꿈이 있다면 세미콜론을 생략할 수 있다. 즉 아래처럼 세미콜론을 생략해도 에러가 발생하지 않는다. 줄 바꿈이 있으면 자바스크립트는 이를 ‘암시적'세미콜론으로 해석하기 때문이다. 이를 세미콜론 자동 삽입이라고 부른다.

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

대부분의 경우 줄 바꿈으로 세미콜론을 생략할 수 있지만, 다음과 같이 예외도 있다. 이 경우에는 세미콜론 자동 삽입이 일어나지 않아 6이 출력된다. 어떤 줄이 + 로 끝나면 그 줄은 ‘불완전한 표현식'이므로 세미콜론이 필요하지 않기 때문이다.

alert(3 +
1
+ 2);

그러나 세미콜론이 필요하지만 자바스크립트가 이를 암시적으로 삽입해주지 못하는 상황도 있다. 이 경우에는 에러가 발생해도 찾거나 고치기가 어렵다.

[1, 2].forEach(alert)

위 코드를 실행하면 alert(1), alert(2) 가 실행된다.

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

[1, 2].forEach(alert)

세미콜론을 붙이지 않은 alert() 문을 앞에 삽입하면 첫 번째 줄의 alert() 만 제대로 실행되고 에러가 발생한다.

alert() 문 뒤에 세미콜론을 추가하면 다시 제대로 동작한다.

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

[1, 2].forEach(alert)

에러가 발생한 이유는 자바스크립트가 대괄호 [1, 2] 앞에는 세미콜론이 있다고 가정하지 않기 때문이다. 따라서 세미콜론 자동 삽입이 일어나지 않고 첫 번째 예제는 다음과 같이 단일문으로 처리된 것이다.

alert("제대로 동작합니다.")[1, 2].forEach(alert)

이 예제 외에도 비슷한 상황이 발생할 여지는 많다.

따라서 줄 바꿈으로 문을 나누었더라도, 한 statement 가 끝나면 세미콜론을 넣는 것이 권장된다.

주석

주석은 어느 곳에나 작성할 수 있고, 한 줄짜리 주석은 두 개의 슬래시 // , 여러 줄 주석은 /* */ 로 표현한다. 단, 중첩 주석은 지원되지 않는다.

주석은 서버 배포 전 코드를 압축하는 단계에서 삭제되므로, 코드에 부정적인 영향을 끼치지 않는다!

profile
개발자 헤이린 🔜 프로덕트 매니저로 나아가는 중!

0개의 댓글