JS Deep Dive - 20. strict mode

20.1 strict mode란?

위와 같은 코드를 실행하면 어떤 결과가 나올까?

 

x 변수의 선언이 존재하지 않지만 자바스크립트 엔진은 암묵적으로 전역 객체에 x 프로퍼티를 동적 생성한다.

이때 전역 객체의 x 프로퍼티는 마치 전역 변수처럼 사용할 수 있으며 이러한 현상을 암묵적 전역이라 한다.

개발자의 의도와는 상관없이 발생한 암묵적 전역은 오류를 발생시키는 원인이 될 가능성이 크다.

따라서 반드시 var, let, const 키워드를 사용하여 변수를 선언한 다음 사용해야 한다.

 

그럼에도 불구하고 실수로 인해 발생하는 오류를 줄이기 위해 ES5부터 strict mode(엄격 모드)가 추가되었다.

strict mode는 자바스크립트 언어의 문법을 좀 더 엄격히 적용하여 오류를 발생시킬 가능성이 높거나 자바스크립트 엔진의 최적화 작업에 문제를 일으킬수 있는 코드에 대해 명시적인 에러를 발생시킨다.

(이외에도 ESLint같은 린트 도구를 사용해 strict mode와 유사한 효과를 얻을 수 있다.

린트 도구 : 정적 분석 기능을 통해 소스코드를 실행하기 전에 소스코드를 스캔하여 문법적 오류만이 아니라 잠재적 오류까지 찾아내고 오류의 원인을 리포팅해주는 유용한 도구. 필자는 린트 도구 사용을 선호)

 20.2 strict mode의 적용

strict mode 적용법 : 전역의 선두 또는 함수 몸체의 선두에 'use strict'; 를 추가.

(전역의 선두에 추가하면 스크립트 전체에 적용되고, 함수 몸체의 선두에 추가하면 해당 함수와 중첩 함수에 적용됨)

전역 선두에 적용한 모습

 다만, 전역 선두에 적용하는 것은 다른 mode와 혼용되어 오류를 발생시킬 가능성이 있으므로 피하자.

함수 단위도 적절하지 않다. 일부에만 적용되면 문제가 발생할 수 있기 때문 

 

=> 즉시 실행 함수로 감싼 스크립트 단위로 적용하는 것이 바람직함.

 20.5 strict mode가 발생시키는 에러

- 암묵적 전역 : 선언하지 않은 변수를 참조하면 ReferenceError 발생

- 변수, 함수, 매개변수의 삭제 : delete 연산자로 변수, 함수, 매개변수를 삭제하면 SyntaxError 발생

- 매개변수 이름의 중복 : 중복된 매개변수 이름을 사용하면 SyntaxError 발생

- with 문의 사용 : with 문 사용시 SyntaxError 발생

 

20.6 strict mode 적용에 의한 변화

-일반 함수의 this 

strict mode에서 함수를 일반 함수로서 호출하면 this에 undefined가 바인딩 됨. 일반 함수 내부에서는 this를 사용할 필요가 없기 때문.

- arguments 객체

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