[JavaScript] The Modern JavaScript Tutorial - (2-2~3) Code Structure & "use strict"

Code Structure

문장

문장(statement)은 어떤 작업을 수행하는 문법 구조(syntax structure)와 명령어(command)를 의미한다.

서로 다른 문장은 세미콜론으로 구분하며, 가독성을 위해 개행하는 것이 일반적이다.

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

 

세미콜론

줄 바꿈이 있다면, 세미콜론(semicolon)을 생략할 수 있다.

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

ECMAScript® 2022 Language Specification

ECMAScript® 2022 Language Specification

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

 

항상 그런 것은 아니다. 아래와 같이 줄 바꿈이 세미콜론을 의미하지 않는 경우도 있다.

alert(3 +
1
+ 2);

 

어떤 줄이 "+"로 끝나면, 그 줄은 '불완전한 표현식'이기 때문에 세미콜론을 필요로 하지 않는다.

반면에 세미콜론이 정말 필요하지만 자바스크립트가 이를 추정하지 '못하는' 상황 또한 존재한다. 이런 에러는 찾거나 고치기가 상당히 어렵다.

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

[1, 2].forEach(alert)

 

자바스크립트는 대괄호 [...] 앞에는 세미콜론이 있다고 가정하지 않기 때문에, 해당 예제는 단일문으로 처리된다.

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

따라서 줄 바꿈으로 각 문장을 나눴어도 세미콜론을 넣는 것이 좋다.

 

주석

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

// 한 줄을 차지하는 주석입니다.
alert('Hello');

alert('World'); // 뒤에 이어지는 주석입니다.

/* 두 줄짜리 주석도
작성할 수 있습니다.
*/

/* 코드 주석
alert('!');
*/

 

The modern mode, "use strict"

자바스크립트는 ECMAScript5(ES5)가 등장하기 전까지는 꽤 오랫동안 호환성 이슈 없이 발전해 왔다. 그러나 ES5부터는 새로운 기능이 추가되고, 기존 기능 중 일부가 변경되어 하위 호환성 문제가 생길 수 있다. 이를 방지하기 위해 ES5는 기본 모드에서는 이러한 것들이 활성화되지 않도록 설계되었으며, use strict라는 특별한 지시자를 사용하여 strict mode를 활성했을 때만 변경 사항이 활성화되게 해 놓았다.

 

use strict

"use strict" 또는 'use strict'는 스크립트 최상단에 오면, 스크립트 전체가 모던한 방식으로 동작한다.

"use strict"

// 이 코드는 모던한 방식으로 실행됩니다.

스크립트 최상단이 아닌, 함수 본문 맨 앞에도 위치할 수 있다. 이렇게 하면 해당 함수만 strict 모드로 실행된다.

use strict를 취소할 방법은 존재하지 않음에 유의한다.

 

브라우저 콘솔

브라우저 콘솔에는 기본적으로 use strict이 적용되어 있지 않다는 점에 유의한다.

이러한 경우 use strict을 입력한 후, Shift + Enter를 눌러 줄 바꿈하여 원하는 스크립트를 입력하면 된다.

 

'use strict'을 꼭 사용해야 하나요?

모던 자바스크립트는 '클래스'와 '모듈'이라 불리는 구조를 제공하는데, 이 둘을 사용하면 use strict가 자동으로 적용된다.

strict 모드를 사용하면 개발자의 삶의 질이 조금 더 높아진다. 😉

 

 

해당 포스트는 'The Modern JavaScript Tutorial' 문서를 읽으며 개인 백업용으로 메모하였습니다.

javascript.info/

The Modern JavaScript Tutorial