strict mode

윤영훈·2021년 5월 31일
0
post-thumbnail

아래 예제의 결과를 생각해보자

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

foo 함수 내부에서 선언하지 않은 변수 x에 값 10을 할당했다. 이 때, x변수를 찾아야 x에 값을 할당할 수 있기 때문에 자바스크립트 엔진은 x변수가 어디서 선언됬는지 스코프체인을 통해 검색하기 시작한다.

먼저 foo함수 내부에서 검색 -> 없기 때문에 foo 함수의 상위 스코프에서 검색 ( 여기서는 전역 스코프 )

전역스코프에도 x변수의 선언이 존재하지 않기 때문에 ReferenceError를 발생시킬 것 같지만 자바스크립트 엔진은 암묵적으로 전역 객체의 x의 프로퍼티를 동적 생성한다. 이 때, 전역 객체의 x 프로퍼티는 마치 전역변수처럼 사용할 수 있다. 이러한 현상을 암묵적 전역이라 한다.

strict mode가 필요한 이유

개발자의 의도와는 상관없이 발생한 암묵적 전역은 오류를 발생시키는 원인이 될 가능성이 크다.
따라서 반드시 var, let, const를 사용하여 변수를 선언한다음 사용해야 한다.

하지만 오타나 문법지식의 미비로 인한 실수는 언제나 발생한다. 잠재적인 오류를 발생시키 어려운 개발환경을 만들고 그 환경에서 개발하는것이 좀 더 근본적인 해결책이다.

strict mode 등장

이를 지원하기 위해 ES5부터 strict mode(엄격모드)가 추가 되었다.
strict mode는 자바스크립트 언어의 문법을 좀 더 엄격히 적용하여 오류를 발생시킬 가능성이 높거나 자바스크립트 엔진의 최적화 작업에 문제를 일으킬 수 있는 코드에 대해 명시적인 에러를 발생한다.

strict mode의 적용

참고로 ES6에서 도입된 클래스와 모듈은 기본적으로 strict mode가 적용된다.

strict mode를 적용하려면 전역의 선두 또는 함수 몸체의 선두에 'use strict'를 추가한다.
전역의 선두에 추가하면 스크립트 전체에 strict mode가 적용된다.

'use strict'
function foo(){
  x = 10;
}
console.log(x) // ReferenceError : x is not defined

도구 사용

ESLint 같은 린트 도구를 사용해도 strict mode와 유사한 효과를 볼 수 있다.
린트도구는 strict mode가 제한하는 오류는 물론 코딩 컨벤션을 설정 파일 형태로 정의하고 강제할 수 있기 때문에 더욱 강력한 효과를 얻을 수 있다.

0개의 댓글