[JavaScript] strict mode

strict mode

ECMAScript 5 에서 소개된 JavaScript의 엄격모드는 JavaScript의 제한된 버전을 선택하여

암묵적인 '느슨한 모드' 를 해제할 수 있게 합니다.

 

엄격 모드를 사용하면 평범한 JavaScript 시멘틱스에 몇가지 변경이 일어나게 됩니다.

• 기존에는 조용히 무시하던 에러들을 throwing 합니다
• JavaScript 엔진의 최적화 작업을 어렵게 만드는 실수를 바로 잡습니다.
• 가끔씩 엄격 모드의 코드는 느슨한 모드의 동일 코드보다 더 빨리 작동 됩니다.

출처 : MDN 

---

strict 모드 적용 방법

 

1. 파일에 "use strict" 지시자 입력

"use strict"

// ... javascript 코드

 

2. 함수 안에 "use strict" 를 사용해 그 함수만을 위해 strict mode 적용

function sum(a,b) { 
	"use strict"
	return a + b;
}

 

3. class를 이용하면 자동으로 strict mode 적용

class Cat {
	//자동으로 strict mode 적용
}

 

4. 자바스크립트 파일의 타입을 module로 지정하여 적용

<script src="script.js" type="module">

 

---

strict mode 특징

 

Case 1 ) strict mode X

let greeting = "hello";

grating = 'hi';

console.log(greeting); // hello

 

위 코드의 경우 grating을 선언하지 않고 할당하려고 하였으나 에러가 발생하지 않고 greeting을 출력하고 있습니다.

느슨한 모드이기 때문에 에러를 따로 출력해주지 않는 모습입니다.

 

Case 1 ) strict mode O

let greeting = "hello";

grating = 'hi';

console.log(greeting); 
// Uncaught ReferenceError: grating is not defined

 

위 코드의 경우에는 엄격한 모드이기 때문에 선언을 하지 않고 값을 할당한 것에 대해 오류를 출력해주는 모습입니다.

---

 

Case 2 ) strict mode X 

let greeting = "hello";

grating = 'hi';

console.log(greeting); 
console.log(greeting, window.grating);

 

자바스크립트의 느슨한 모드는

그냥 선언하지 않고 변수를 선언하면 자동으로 window 객체의 변수로 할당이 되게 합니다.

그래서 다음과 같이 잘 출력되는 모습을 볼 수 있죠.

 

 

Case 2 ) strict mode O 

let greeting = "hello";

grating = 'hi';

console.log(greeting); 
console.log(greeting, window.grating);

 

정확히 window.grating으로 선언한 변수가 아니기 때문에 아래같이 에러가 출력됩니다.