strict mode 에 대해 알아보자!

웹팩을 공부하던 도중

아래와 같이 use strict라는 것이 보이게 되었다. 그래서 strict mode에 대해 알아보게 되었다.

strict mode란?

말그래도 엄격한? 모드이다. 내가 생각할 때 js는 다른 언어들에 비해 타입도 없고 조금 유연한 언어라 생각한다. 따라서 이러한 점이 편리할 수 있지만 에러를 유발하기도 쉽다. 따라서 strict mode를 통해 에러를 유발하기 쉬운 상황을 보다 엄격하게 제어하는것 같다.

strict mode시 에러가 나는 상황

// "use strict";
const test = () => {
  x = 1;
  return x;
};
console.log(test());

이 코드는 정상적으로 1이 나온다. var 또는 const 키워드를 사용하지 않아도 암묵적으로 전역객체의 프로퍼티로 등록이 되는것이다.
하지만 strict mode로 실행한다면 ReferenceError: x is not defined 라는 에러를 확인할수 있을 것이다.

function test(x, x) {
  return x + x;
}
console.log(test(1)); // NaN

위와 같은 상황은 에러가 나지 않고 NaN이 나온다.
이때

const test = (x, x) => {
  return x + x;
};
console.log(test(1));

위와 같이 화살표 함수를 쓰거나 strict mode를 사용한다면 SyntaxError: Duplicate parameter name not allowed in this context syntax error 가 나는것을 확인할 수 있다.

다른 점

• strict mode에서 함수를 일반함수로 호출하게 된다면 this에 undefined가 바인딩된다.

사용 예

맨위에서 보다시피 웹팩을 통해 번들을 할때 strict mode가 적용이 되는것을 볼 수 있다.
이는 웹팩이 모듈을 위한 번들러이기 때문인데, 모듈은 strict mode로 동작하기 때문에 번들파일을 본다면 strict mode가 적용되어있는것을 확인할 수 있다.!