17. Strict 모드

안녕하세요 박기린입니다.
JS는 높은 유연성을 가지고 있습니다. 대표적으로 type coercion이 일어난다는 점이 있죠. 하지만 유연함이 독이 될 수 있습니다. 유연한 대처를 원하지 않는 상황에서도 JS엔진이 개발자의 마음을 몰라주고 유연하게 대처해버려서 생각치도 못한 버그를 만날 수 있기 때문입니다.

 

다행히 이러한 상황일 방지해주는 모드가 있습니다. 바로 strict 모드입니다.

---

 

 

Strict 모드

Strict(엄격한) 모드는 높은 안전성을 가진 코드를 만들기 위해서 존재합니다.

1. 특정 행동을 금지합니다.

2. JS엔진이 쉽게 지나칠 수 있는 오류가 발생하는 상황에서, 눈에 보이는 Error 문구를 개발자에게 강조해서 보여줍니다.

---

 

 

 

Strict 모드 사용하는 방법

'use strict'

이 코드를 맨 처음에 작성하면 JS엔진이 알아서 strict 모드를 실행합니다. 대신에 무조건 맨 첫 줄에 있어야 합니다.

참고로 strict모드를 함수 단위, {블록}단위로만 적용할 수도 있습니다.

 

function strict() {
  // 함수-레벨 strict mode 문법
  'use strict';
  function nested() { return "And so am I!"; }
  return "Hi!  I'm a strict mode function!  " + nested();
}
function notStrict() { return "I'm not strict."; }

(위의 예제코드는 https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Strict_mode 에서 발췌했습니다.)

---

 

 

 

Strict 모드 - 특정 행동을 금지해서 개발자가 놓치기 쉬운 오류를 방지해준다.

Strict 모드를 사용하기 전

let hasDriversLicense = false;
const passTest = true;
if (passTest) hasDriverLicense = true; // Driver 뒤에 s가 빠짐. 하지만 error표시는 안 뜸. JS는 var이나 let 기호가 없어도 변수를 생성하기 때문이다.
if (hasDriversLicense) console.log('I can drive :D'); // 아무것도 Console에 표시되지 않음.

첫 번째 줄에서 'hasDriversLicense'라는 변수명을 가진 변수를 생성했습니다.

세 번째 줄에서 이 변수를 사용하려고 했는데 오류가 생겼습니다. Drivers의 s를 빼고 적은 것입니다.

다른 프로그래밍 언어라면 오류메시지를 뿜어낼 상황입니다. 하지만 JS는 오류메시지를 출력하지 않은 채 넘어갑니다. 왜냐하면 JS는 var이나 let 기호가 없어도 변수를 생성할 수 있기 때문입니다.

 

그래서 세 번째 줄은 이렇게 실행이 됩니다.

1. passTest가 true값을 가지기 때문에 if 안의 구문이 실행됩니다.

2. hasDriverLicense라는 변수명을 가진 변수를 생성한 후, true(boolean)값을 넣어줍니다.

3. 첫 번째 줄에서 생성한 hasDriversLicense 변수 안에는 여전히 false값이 담겨 있습니다.

 

결국 네 번째 줄의 if문 안에 있는 코드는 실행되지 않습니다. hasDriversLicense가 여전히 false 이기 때문입니다. 

 

 

Strict 모드를 사용한 후 

'use strict'

let hasDriversLicense = false;
const passTest = true;
if (passTest) hasDriverLicense = true; 
if (hasDriversLicense) console.log('I can drive :D'); // ReferencError

하지만 여기에 strict 모드를 적용시키면, ReferenceError를 빨간색글자로 아주 잘 알려줍니다. 왜냐하면 Strict 모드는 var, let 키워드 없이 변수를 생성하는 것을 전면 금지하기 때문입니다.

---

 

 

 

Strict 모드 - 예약어의 종류를 늘려서 체크해준다.

const interface = 'Audio'; // SyntaxError: Unexpected strict mode reserved word
const private = 534; // SyntaxError: Unexpected strict mode reserved word

JS는 업데이트를 하면서 새로운 기능과 함께 예약어가 등장합니다. 하지만 새로생긴 예약어가 옛날 버전에서 쓰인 JS에서 이미 변수명으로 쓰였을 수도 있습니다. JS엔진은 이런 상황이 발생했을 때 오류 표시를 하지 않습니다. 

---

 

 

이 뿐만 아니라 functions, objects, setting properties on primitive value 등 다양한 곳에서 strict 모드의 기능이 있지만, 차근차근 알아가보도록 하겠습니다. (작성 후 링크 연동 예정)