본문 바로가기
JavaScript Study

JavaScript - #23. Strict Mode

by KMS_99 2023. 9. 22.

Strict Mode는 ES5부터 지원을 시작하였으며, 자바스크립트에서 허용되는 불안정한 문법들을 엄격하게 적용하여 오류를 명시적으로 발생하는 기능을 한다.

 

1. Strict Mode의 적용

Strict Mode를 적용하기 위해서는 전역의 선두 혹은 함수의 몸체의 선두에 'use strict'; 을 추가한다.

전역 선두에 추가하면 스크립트 전체가 Strict Mode가 적용이된다.

'use strict'; // 전역 엄격모드

function foo(){
    x=10; // ReferenceError
}
foo();

함수 몸체 선두에 적용하면 해당 함수와 중첩 함수에만 Strict Mode가 적용된다.

function foo2(){
    y=10; // 변수 y가 전역 변수로 암묵적 선언이 일어남, 오류 x
}
foo2();

function foo(){
    'use strict';
    x=10; // ReferenceError
}
foo();

또한 'use strict'; 문을 상단에 두지 않았을 때는 제대로 동작하지 않는다.

function foo(){
    x=10; // 오류 발생 x
    'use strict';
}
foo();

 

2. 전역 strict mode

전역에 엄격모드를 사용하는 경우 해당 스크립트 전체가 엄격모드가 되고 다른 스크립트에는 영향을 주지 않는다.

이렇게 되면 엄격모드인 경우와 엄격모드가 아닌 경우의 스크립트를 혼용하여 사용하게 되는데 이 때문에 오류가 발생 할 수 있다. 특히 외부 서드파티 라이브러리(프로그램 개발과 개발자 사이의 플러그인, 라이브러리, 프레임워크 등)을 사용하는 경우 라이브러리가 엄격모드가 아닌 경우가 있어 전역에 엄격모드를 지정하는 것은 바람직하지 않다.

 

3. 함수단위 strict mode

함수단위에 엄격모드를 적용할 수 있다. 어떤함수는 엄격모드를 적용하고 어떤함수는 엄격모드를 적용하지 않는다면 바람직한 사용법이 아니다. 또한 함수를 참조하는 외부 컨텍스트에서 엄격모드가 적용되어있지 않다면 오류가 발생할 수도 있다. 하지만 strict mode를 일일이 모든 함수에 적용하기도 어렵다.

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

 

4. strict mode가 발생시키는 에러

- 암묵적 전역

선언하지 않은 변수를 참조했을 때 참조 에러를 발생시킨다.

(function(){
    'use strict';
    x = 1;
    console.log(x); // ReferenceError
}())

 

- delete 연산자를 활용한 변수, 함수, 매개변수 삭제

strict mode에서 delete 연산자를 사용하여 삭제할 수 없다. (사용불가)

(function(){
    'use strict';
    let x = 1;
    delete x; // SyntaxError : Delete of an unqualified identifier in strict mode

    function foo(a){
        delete a; // SyntaxError : Delete of an unqualified identifier in strict mode
    }

    delete foo; // SyntaxError : Delete of an unqualified identifier in strict mode
}())

- 매개변수 중복

매개변수의 식별자가 중복될 시 오류를 발생시킨다.

(function(){
    'use strict';

    function foo(x,x){
        return x+x;
    }

    console.log(foo(1,2)) // SyntaxError: Duplicate parameter name not allowed in this context 
}())

- with 문의 사용

with 문은 전달된 객체를 스코프체인에 추가하여 동일한 객체의 프로퍼티를 반복해서 사용할 때 사용하며,

해당 with문을 엄격모드에서 사용 할 시 오류가 발생한다.

with문은 가독성이 나빠지는 문제가 있어 사용하지 않는 것이 좋다.

 

5. strict mode 적용에 의한 변화

- 일반함수의 this

this는 생성자 함수에서 인스턴스를 지칭할 때 사용한다. 

하지만 일반함수에서 this는 사용할 필요가 없다. 엄격모드가 아닌 일반함수에서의 this는 전역객체를 나타낸다.

엄격모드에서 일반함수의 this는 전역객체가 아닌 undefined를 반환한다.

(function(){
    'use strict';

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

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

    new Foo();
}())

- arguments 객체

strict mode에서 매개변수에 전달된 인수를 재할당하여도 arguments 객체에 적용되지 않는다.

(function(){
    'use strict';

    function foo(x){
        console.log(arguments); // Arguments[10]
        x =20;
        console.log(arguments); // Arguments[10]
    }

    foo(10)
}())