[JavaScript] 딥다이브 / 20장 strict mode

strict mode

function foo() {
  x = 10;
}
foo();
console.log(x); // 10

위 코드의 경우 선언하지 않은 x 변수에 10을 할당했다.
선언되지 않았기 때문에 foo 함수의 스코프에도, 전역 스코프에도 x를 찾을 수 없다. 따라서 ReferenceError가 발생하는 게 맞는 것 같지만 실제로는 JS 엔진이 암묵적으로 전역 객체에 x 프로퍼티를 동적 생성한다. 이러한 현상을 암묵적 전역이라 한다.

참고) 암묵적 전역은 변수가 아니기 때문에 변수 호이스팅은 발생하지 않는다.

이와 같이 개발자의 의도와 상관없이 코드가 동작하는 경우를 최소화하기 위해 JS의 문법을 더 엄격히 적용시킨 strict mode가 추가되었다.
(참고로 ESLint와 같은 린트 도구의 경우 strict mode가 제한하는 오류는 물론 코딩 컨벤션을 설정 파일 형태로 정의하고 강제할 수 있기 때문에 strict mode보다 더 선호되는 방식이다.)

// 전역이나 함수의 선두에 'use strict';를 추가
(function () {
  'use strict';
  ...
})();

strict mode 적용 시 유의사항

1. 전역 단위로 strict mode를 적용하는 것은 피하자.
   전역에 적용한 strict mode는 스크립트 단위로 동작하는데, 스크립트마다 strict mode를 다르게 적용하는 것은 오류를 발생시킬 수 있으며, 특히 외부 서브파티 라이브러리를 사용하는 경우 라이브러리가 non-strict mode인 경우도 있기 때문에 전역에 strict mode를 적용하는 것은 바람직하지 않다.

2. 함수 단위로 strict mode를 적용하는 것도 피하자.
   어떤 함수는 strict mode를 적용하고 어떤 함수는 적용하지 않는 것은 바람직하지 않으며 strict mode가 적용된 함수가 참조하는 외부 컨텍스트가 strict mode를 적용하지 않는다면 이 또한 문제가 발생할 수 있다.

따라서 strict mode는 즉시 실행 함수로 감싼 스크립트 단위로 적용하는 것이 바람직하다.

strict mode가 발생시키는 에러

1. 선언하지 않은 변수를 참조하면 ReferenceError 발생
2. delete 연산자로 변수, 함수, 매개변수를 삭제하면 SyntaxError 발생
3. 중복된 매개변수 이름을 사용하면 SyntaxError 발생
4. with 문을 사용하면 SyntaxError 발생

with 문은 인수로 전달된 객체를 스코프 체인에 추가한다.
동일한 객체의 프로퍼티를 반복해서 사용할 때 객체 이름을 생략할 수 있어 코드가 간단해지는 효과가 있으나 성능과 가독성 문제가 발생하므로 사용하지 않는 것이 좋다.

strict mode 적용에 의한 변화

1. 함수를 일반 함수로서 호출하면 this에 undefined가 바인딩됨
2. 매개변수에 전달된 인수를 함수 내에서 재할당하여 변경해도 arguments 객체에 반영되지 않음