한준호

[Modern javascript] strict mode 본문

Frontend/modern javascript

[Modern javascript] strict mode

igoman2 2021. 8. 25. 22:55
728x90
function foo() {
  x = 10;
}
foo();

console.log(x); // ?

foo 함수의 스코프에서 x 선언부를 검색한다 -> foo 함수 컨텍스트의 상위 스코프에서 x 선언부를 검색한다 -> 찾지 못한다.

참조 에러가 날 듯 싶지만 자바스크립트는 전역 객체에 프로퍼티를 생성한다(암묵적 전역)

 

strict mode를 통해 이러한 실수를 엄격하게 잡아낼 수 있으며 ESLint도 동일한 역할을 한다.

strict mode는 다음과 같이 사용한다.

'use strict';

function foo() {
  x = 10; // ReferenceError: x is not defined
}
foo();

strict mode는 다음과 같은 에러를 감지한다

  • 암묵적 전역
  • 변수, 함수, 매개변수의 삭제(delete)
  • 매개변수 이름의 중복
  • with문의 사용

추가적으로 함수를 일반 함수로서 호출하면 this에 undefined가 반영되는데, 생성자 함수가 아닌 일반 함수에서는 this를 호출할 일이 없기 때문이다.

또한 strict mode에서는 매개변수에 전달된 인수를 재할당하여 변경해도 arguments 객체에 반영되지 않는다.

(function (a) {
  'use strict';
  // 매개변수에 전달된 인수를 재할당하여 변경
  a = 2;

  // 변경된 인수가 arguments 객체에 반영되지 않는다.
  console.log(arguments); // { 0: 1, length: 1 }
}(1));

 

주의할 점으로

1. 전역에 strict mode를 적용하는 것은 피할 것

 -> 외부 라이브러리의 경우 strict mode가 아닐 수도 있기 때문

 -> 즉시 실행 함수를 통해 스코프를 구분한다.

// 즉시 실행 함수의 선두에 strict mode 적용
(function () {
  'use strict';

  // Do something...
}());

 

2. 함수 단위로 strict mode를 적용하는 것은 피할 것

 

728x90
Comments