송민준의 개발노트

엄격 모드 본문

웹/Javascript

엄격 모드

송민준 2021. 12. 7. 00:11

엄격모드란? ( <-> 느슨한 모드 )

기본적으로 자바스크립트는 상위호환성 이슈 없이 발전해왔다. 하지만 기본적으로 불완전하게 만들어졌던 기능들이 있어 ES5에서는 새로운 기능들이 추가되고 기존 기능 중 일부가 변경되었다. 기존 기능이 변경되었기 때문에 하위 호환성에 문제가 있었고 "use strict"라는 특별한 지시자를 사용해 엄격 모드를 활성화 했을 경우만 이 변경사항이 활성화되게 해놓았다. 또한 자바스크립트가 묵인했던 여러 에러들의 에러 메시지를 발생시킨다.

 

사용법

"use strict" // 가장 최상단에 위치해야함

함수에서 사용법

function strict() {
	'use strict';
    // 로직
}

 

* 자바스크립트 엔진을 이전 방식으로 되돌리는 "no use strict" 같은 지시자는 존재하지 않음.

* 클래스와 모듈을 사용할 경우 use strict가 자동으로 적용된다.

 

적용 케이스

1. writable이 false, 읽기 전용 객체인 경우 수정 불가능

// 에러케이스 1
"use strict"
var obj = Object.defineProperties({}, {
	prop1: {
    	value: 10,
        writable: false
    },
    prop2: {
    	get: function() {}
    }
});
obj.prop1 = 10;
obj.prop2 = 20;

2. get으로 선언된 객체는 수정할 수 없음

// 에러케이스 2
"use strict"
var obj = {
	get x() {
    	return ;
    }
};
obj.x = 5;

 

3. 확장 옵션이 false로 설정된 객체에 속성을 확장하는 경우 안됨

// 에러케이스 3
"use strict"
var obj = new Object();
Object.preventExtensions(obj); 
obj.name = "John";

 

4. delete 호출할 수 없음

// 에러케이스 4
"use strict"; 
var testvar = 15; 
function testFunc() {}; 

delete testvar; 
delete testFunc; 

Object.defineProperty(testObj, "testvar", { 
	value: 10, configurable: false 
}); 
delete testObj.testvar;

5. 리터럴 객체는 동일한 이름의 property를 가질 수 없음

// 에러케이스 5
"use strict"; 
var o = { p: 1, p: 2 };

6. 함수의 동일한 매개 변수 이름을 선언하는 것이 불가능

// 에러케이스 6
"use strict"; 
function testFunc(param1, param1) { 
	return 1; 
};

7. 8진수 숫자 리터럴 및 이스케이프 문자를 사용 불가능

// 에러케이스 7
"use strict"; 
var testoctal = 010; 
var testescape = \010;

8. primitive values의 속성 설정이 불가능

// 에러케이스 8
(function() { 
  "use strict"; 
  
  false.true = ""; // TypeError 
  (14).sailing = "home"; // TypeError 
  "with".you = "far away"; // TypeError 
})();

9. arguments를 변수 또는 함수, 매개 변수의 이름으로 사용 불가능

// 에러케이스 9
"use strict"; 
arguments++; 

var obj = { 
	set p(arguments) { } 
}; 
try { } 
catch (arguments) { } 

function arguments() { } 
var f = new Function("arguments", "'use strict'; return 17;");

추가적인 예시

"use strict";

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

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

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

// 확장 불가 객체에 새 프로퍼티 할당
var fixed = {};
Object.preventExtensions(fixed);
fixed.newProp = "ohai"; // TypeError 발생

// 유니크한 함수 파라미터 이름 요구
function sum(a, a, c){ // !!! 구문 에러
  "use strict";
  return a + b + c; // 코드가 실행되면 잘못된 것임
}

// 8진수
var a = 0o10; // ES6: 8진수

 

 

간략하게 9개 정도의 케이스를 정리했는데 느낀점은 '이런게 가능했다고...?' 라는 느낌이다. 애초에 자바스크립트 공부를 es5부터 시작했기 때문에 그렇게 느끼는 것도 있고 자바스크립트에 대해 자세하게 알지 못하는 것도 이유인듯 하다.

좀 더 자세한 내용들은 아래 링크에 있다.

 

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

 

Strict mode - JavaScript | MDN

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

developer.mozilla.org

 

https://beomy.tistory.com/13

 

[자바스크립트] 엄격 모드(strict mode)

strict mode strict 모드는 ES5(ECMA Script 5)에 추가된 키워드입니다. strict 모드는 자바스크립트가 묵인했던 에러들의 에러 메시지를 발생시킵니다. 엄격하게 문법 검사를 하겠다.. 로 이해하면 될 것

beomy.tistory.com