[JS Deep Dive] 20장 - strict mode

 

 

1. strict mode 의 배경

function hihilong() {
	x=10;
}
hihilong();

console.log(x);
//?

 

이걸 생각해보자. 

hihilong 함수 내에서 선언하지 않은 x 변수에 값 10을 할당을 해버렸다. 

 

이때 x 변수를 찾아야 x 에 값을 할당할 수 있는 것이기 때문에 자바스크립트 엔진은 x 변수가 어디에서 선언이 되었는지를 

스코프체인을 통해 검색을 하기 시작한다 (-위로 올라가면서 찾는 것임!) 

 

그런데 이때 hihilong 함수의 스코프에는 x 변수의 '선언' 이 없으므로... 검색이 실패를 할 섯이다. 

따라서 자바스크립트 엔진은 x 변수가 어디에 선언이 되었는지를 검색하기 위해서 hihilong 삼수 컨텍스트의 상위스코프에서 x 변수의 선언을 검색핮ㄴ다. 

 

그런데 이때.. 전역스코프에도 x변수의 선언이 존재하지 않아 에러가 날 것같지만!

자바스크립트 엔진은 암ㄱ적으로 전역객체에 x프로퍼티를 동적 생성한다. 

따라서 마치 x프로퍼티는 마치 전역변수처럼 사용할 수 있는데 이러한 현상을 암묵적 전역이라고 한다. 

하지만 이것이 오류가 날 수 있기 때문에 반드시 var, let,, const 키워드를 사용하여 변수를 선언한 다음 사용해야한다. 

 

 

 

 

그렇지만 오타나 문법 지식의 미비로 인한 실수는 발생하기 마련이다. 

잠재적인 오류를 줄이고자 하여 ES5부터는 엄격모드가 추가되었다. 

 

엄격모드는... 좀더 문법을 엄격히 적용하여 문법을 발생시킬 가능성이 높거나 최적화작업에 문제를 일으킬 수 있는 코드에 대해 명시적인 에러를 발생시킨다. 

대표적인 것으로 EsLint 같은 린트 도구를 사용해도 유사한 효과를 받을 수 있다. 

 

 

2. strict mode 의 적용

사용하려면 전역의 선두나 함수 몬체의 선두에 'use strict;' 를 추가한다. 

이렇게 하면 스크립트 전체에 strict mode 가 적용이 된다. 

 

'use strict';

functio hihilong() {
	x=10;
}

hihilong();

 

 

2. 🚧  strict mode 올바르게 사용하자!

 

(1) 전역에 strict mode 적용하는 것 피하자! 

전역에 작용한 strict mode 는 스크립트 단위로 적용이 됨

따라서 다른 스크립트에 영향을 주지 않고 해당 스크립트에  한정되어 적용이 된다. 

따라서... 전역 strict mode 를 적용하는 것은 바람직하지 않음 ! 

 

(2) 함수 단위로 strict mode 적용하는 것 피하자!

어떤 함수는 적용하고 어떤 함수는 적용하지 않는 것은 바람직하지 않으며 모든 함수에 일일이 strict mode 를 적용하는 것은 참 번거로운 ㅣㅇㄹ이다... 그리고 strict mode 가 적용된 함수가 참조할 함수 외부 컨텍스트에 stirct mode 를 적용하지 않으면 에러발생할 수 있다. 

따라서 strict mode 는 즉시 실행함수로 감싼 스크리트 단위로 적용하는 것이 바람직

 

 

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

(1) 암묵적 전역

선언하지 않은 변수를 참조하면 ReferenceError 발생함

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

 

(2). 변수, 함수, 매개변수의 삭제

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

functio (){
	'use strict';
    
    var x=1;
    delete x;
    //Syntax Error
    
    }
}();

 

(3) 매개변수 이름의 중복

중복된 이름 사용하면 에러남

function () {
	'use strict';
    
    function hihilong(x,x) {
    	return x+x;
    }
    console.log(hihilong(1,2));
}());

// 매개변수 에러남

 

(4)  with 문의 사용

with 문은 전달된 객체를 스코프 체인에 추가함

반복해서 사용할 때 객체 이름을 생략할 수 있어서 코드가 간단해지는 효과가 있지만 ! 

성능과 가독성이 나빠지는 문제가 있음...

 

따라서 사용하지 않는 것이 좋음

 

 

4. strict mode 적용에 의한 변화

(1) 일반 함수의 this

 

strict mode 에서 함수를 일반 함수로서 호출하면 this 에 undefined 가 바인딩됨

생성자 함수가 아닌 일반 함수 내부에서는 this 를 사용할 필요가 없기 때문임...

이때 에러는 발생하지 않음 !

function () {
	'use strict';
    
    functio hihilong() {
    	console.log(this);
        //undefined
    }
    
 }());

 

(2) arguments 객체

매개변수에 전달된 인수를 재할당하여 변경해도 arguments 객체에 반영되지 않음

function (a) {
	'use strict';
    
    a=2;
    
    //매개변수에 전달된 인수를 재할당하여 변경
    //변경된 인수가 arguments 객체에 반영되지 않음
    
    console.log(arguments);
    // {0:1, length:1}
}());