Strict mode (엄격 모드)

Sulhwa Choi·2022년 10월 14일
0

Strict mode란?

function foo() {
  x = 10;
}

console.log(x);  //10
  • 자바스크립트 엔진은 암묵적으로 전역객체에 x 프로퍼티를 동적으로 생성, x 프로퍼티를 전역변수처럼 사용 가능한데 이걸 암묵적 전역 변수(implicit global)라 한다.

  • 이 암묵적 전역변수는 오류를 발생시키는 원인이 될 가능성이 높아 꼭 var, let, const 키워드를 사용하여 변수를 선언한 다음에 사용해야한다 !

  • 새롭게 제정된 ES5에서는 새로운 기능이 추가되고 기존 기능 중 일부가 변경되었는데, 기존 기능을 변경하였기에 하위 호환성 문제가 생겨 변경사항 대부분은 ES5의 기본 모드에선 활성화되지 않도록 설계되었는데, use strict라는 특별한 지시자를 사용해 엄격 모드(strict mode)를 활성화 했을 때만 이 변경사항이 활성화 되도록 하였다.

  • 잠재적인 오류를 발생시키기 어려운 개발 환경을 만들고 그 환경에서 개발을 하는 것으로 오류를 줄일 수 있다.

strict mode 특징
1. 기존에 무시되던 에러들을 Throwing 한다.
2. JS 엔진의 최적화 작업을 어렵게 만드는 실수들을 바로잡음.
3. ECMAScript의 차기 버전들에서 정의될 문법을 금지한다.

ESLint와 같은 린트 도구를 사용하여도 strict mode와 유사한 효과를 얻을 수 있다.
=> 정적 분석(static analysis) 기능을 통해 소스 코드를 실행하기 전에 소스 코드를 스캔하여 문법적 오류만이 아니라 잠재적 오류까지 찾아내고 오류의 이유를 리포팅해주는 유용한 도구


Strict mode 적용 방법

'use strict';
// 전역의 선두에 추가하면 스크립트 전체에 적용!
// 함수 몸체의 선두에 추가하면 해당 함수 및 중첩된 내부 함수에 적용 !

Strict mode 발생시키는 에러

'use strict'

x = 10;
console.log(x); // Reference Error 

선언되지 않은 변수 참조 시 Reference Error 발생

'use strict'

let x = 10;
delete x; // Syntax Error 

delete연산자로 변수,함수,매개변수 삭제 시도 시 Syntax Error 발생

'use strict'

function foo(x, x){
	return x + 10;
} //Syntax Error

매개변수 이름을 중복으로 사용 시, Syntax Error 발생

'use strict'

  function foo() {
    console.log(this); // undefined
  }
  foo();

  function Foo() {
    console.log(this); // Foo
  }
  new Foo();

strict모드에서 일반함수로 호출 시 this에는 undefined가 반영되고 이때는 오류가 발생하지 않는다. 생성자 함수가 아닌 일반 함수 내부에서는 this를 사용할 필요가 없기 때문이다.

'use strict'

var foo = {
    name: "foo"
}
with (foo) {
    console.log(name);
}

with를 위와 같이 사용할 순 있지만, with 블록 안에 name은 전역 변수의 name인지 foo의 name인지 모호합니다. 그렇기 때문에 strict 모드에서는 with를 사용하는 것이 불가능합니다.


기존 자바스크립트 문법과 다른 Strict Mode의 문법

이미지출처

profile
개발 공부 중 〰️ ٩(๑•̀o•́๑)و ✨

0개의 댓글