[모던자바스크립트] 코드 블록 만들기

개발공부/Javascript

떰즈업 2023. 8. 11. 21:21

이 글은 모던자바스크립트https://ko.javascript.info/structure를 참고하여 작성되었습니다. 오류가 있다면 댓글로 말씀 부탁드립니다.

: 어떤 작업을 수행하는 문법 구조(syntax structure)와 명령어(command)

예: alert('Hello, world')

코드엔 원하는 만큼 문을 작성할 수 있고, 서로 다른 문은 세미콜론으로 구분

'Hello World'를 두 개의 alert문으로 나눈 예시

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

코드의 가독성을 높이기 위해 각 문은 서로 다른 줄에 작성하는 것이 일반적

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

//에러 없이 동작하는 코드
alert('Hello')
alert('World')

줄 바꿈이 있으면 세미콜론 생략 가능

자바스크립트는 줄 바꿈이 있으면 '암시적' 세미콜론으로 해석 = 세미콜론 자동 삽입(automatic semicolon insertion)

대부분의 경우 줄바꿈 = 세미콜론을 의미(항상은 아님)

줄바꿈이 세미콜론을 의미하지 않는 경우 예시

alert(3+
1
+2);

위의 경우 세미콜론 자동 삽입이 일어나지 않기 때문에 6이 출력됨

반면 세미콜론이 정말로 필요하지만 자바스크립트가 이를 추정하지 못하는 상황도 존재

자바스크립트가 세미콜론을 자동으로 삽입해주지 못하는 상황 예시

alert('에러가 발생합니다')

[1, 2].forEach(alert)

위 코드 실행 시 alert만 제대로 출력되고 1, 2는 출력되지 않는 에러 발생

alert끝에 세미콜론을 추가해 다시 실행하면 코드는 잘 작동

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

[1, 2].forEach(alert)

세미콜론이 없을 때 에러 발생 이유: 자바스크립트가 대괄호 [ . . . ] 앞에는 세미콜론이 있다고 가정하지 않기 때문

대괄호 앞에서는 세미콜론 자동 삽입이 일어나지 않고 첫 번째 예제는 단일문으로 처리됨.

자바스크립트 엔진이 보게 될 코드

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

이 예제 외에도 이런 상황이 발생할 여지는 언제나 있으니, 세미콜론을 항상 써주도록 하자. 특히 초심자일수록!

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

한 줄짜리 주석: 두 개의 슬래시 //

슬래시 뒤에 주석을 적어주면 됨. 한 줄 주석이 차지하는 형태도 있고 문 다음에 주석이 이어지는 형태도 있음

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

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

여러 줄의 주석: 슬래시와 별표 /* 로 시작해 별표와 슬래시 */ 로 끝남

❗중첩 주석은 지원하지 않음
/* ... */ 안에 또 다른 /* ... */ 이 있을 수 없음
주석을 중첩해서 쓰면 에러 발생
/*
	/* 중첩 주석 ?!? */
*/
alert('World');