본문 바로가기
Frontend/Javascript

Javascript strict mode

by 우보틀 2022. 3. 25.

javascript에는 strict mode가 있습니다.

strict mode를 활성화 시키면 평소에는 무시되던 에러들을 발생시키기 시작합니다.

런타임에서 혹시 발생할 수 있는 에러들을 잡아내는데 도움을 줄 수 있습니다.

 

전체 스크립트에 strict mode를 활성화 시키기 위해서는 코드의 최상단에 "use strict"를 추가해주면 됩니다.

"use strict"
console.log('hihi');

아래와 같이 사용하면 부분 함수에 적용할 수 있습니다.

function test() {
    "use strict"
    console.log('hihi')
}

es6의 모듈은 default가 strict mode 입니다.

script type="module"을 사용하면 strict mode가 default로 사용됩니다.

 

몇 가지 예시를 확인해보겠습니다.

 

전역 변수가 의도치 않게 생기는 것을 방지해 줍니다.

"use strict"

// mistypedVariable 변수가 존재한다고 가정

mistypedvariable = 17; // 오타로 인해 ReferenceError를 발생시킵니다.

 

조용히 무시되던 에러들을 throwing 합니다.

"use strict"

// 쓸수 없는 프로퍼티에 할당
var undefined = 5; // TypeError 발생
var NaN = 5;  // TypeError 발생

// 쓸 수 없는 프로퍼티에 할당
var obj1 = {}
Object.defineProperty(obj, 'x', {value: 4, writable: false})
obj1.x = 5; // TypeError 발생

// getter-only 프로퍼티에 할당
var obj2 = { get x() { return 17; } }
obj2.x = 10; // TypeError 발생

// 확장 불가능 객체에 새 프로퍼티 할당
var fixed = {}
Object.preventExtension(fixed); // Object.seal, Object.freeze
fixed.a = 'a'; // TypeError 발생

 

삭제할 수 없는 프로퍼티를 삭제하려 할때 error를 발생시킵니다.

"use strict"
delete Object.prototype // 에러발생

 

전역 this는 strict mode에서 undefined를 반환합니다. (this는 node에서는 global, 브라우저에서는 window)

 

 

 

https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Strict_mode

 

Strict mode - JavaScript | MDN

엄격 모드는 평범한 JavaScript 시멘틱스에 몇가지 변경이 일어나게 합니다.

developer.mozilla.org

 

'Frontend > Javascript' 카테고리의 다른 글

Javascript 얕은 복사, 깊은 복사  (0) 2022.03.27
Javascript Polyfill  (0) 2022.03.26
Javascript 화살표 함수  (0) 2022.03.25
Javascript event capturing, bubbling  (0) 2022.03.25
Javascript Callback, Promise, async, await  (0) 2022.03.22