▶ JavaScript Tutorial

JavaScript Strict Mode

JavaScript Strict Mode: 엄격 모드의 이해와 활용

JavaScript Strict Mode(엄격 모드)는 ECMAScript 5(ES5)에서 도입된 기능으로, 자바스크립트의 오류를 쉽게 감지하고, 안전한 코드를 작성할 수 있도록 도와주는 모드입니다. 엄격 모드를 활성화하면 기존의 느슨한 구문 규칙들이 더 엄격하게 적용되며, 잠재적인 오류를 예방할 수 있는 코드 작성을 유도합니다.

이 가이드는 Strict Mode의 사용법과 적용되는 주요 규칙을 설명하며, 이를 활용한 안전한 코딩 방법을 다룹니다.

1. Strict Mode란?

Strict Mode는 JavaScript 코드가 더 엄격하게 해석되도록 만드는 선택적 기능입니다. "use strict" 지시어를 사용하여 활성화할 수 있으며, 이를 통해 다음과 같은 이점을 얻을 수 있습니다:

암묵적인 오류를 감지하고, 명확한 오류 메시지를 통해 디버깅이 쉬워집니다.
JavaScript 엔진이 최적화하기 쉽게 만들어 성능 개선을 유도합니다.
보안 취약성을 줄이고, 안전한 코딩을 촉진합니다.

2. Strict Mode 활성화 방법

Strict Mode는 전역 또는 함수 내에서 활성화할 수 있습니다. 이를 위해 **"use strict";**를 코드 상단에 추가하면 됩니다.

2.1. 전역에서 Strict Mode 활성화

Strict Mode를 전역에서 활성화하면 해당 스크립트 파일 전체가 엄격 모드로 동작합니다.

"use strict";

x = 10;  // 오류: x는 선언되지 않음 (Strict Mode에서는 변수 선언 없이 할당할 수 없음)

2.2. 함수 내에서 Strict Mode 활성화

Strict Mode는 특정 함수 내부에서만 적용할 수도 있습니다.

function myFunction() {
    "use strict";
    y = 20;  // 오류: y는 선언되지 않음
}

myFunction();

이 경우, myFunction 함수 내부에서만 Strict Mode가 적용되고, 다른 코드에는 영향을 미치지 않습니다.

3. Strict Mode의 주요 규칙

Strict Mode를 활성화하면 기존 JavaScript의 느슨한 구문 규칙들이 엄격해지며, 몇 가지 주요한 변화가 적용됩니다.

3.1. 암묵적 변수 선언 금지

Strict Mode에서는 변수 선언 없이 변수에 값을 할당하는 것이 금지됩니다. 변수는 반드시 let, const, **var**로 선언한 후에 사용할 수 있습니다.

"use strict";
x = 3.14;  // 오류: x는 선언되지 않음

3.2. 읽기 전용 속성 수정 금지

객체의 읽기 전용 속성을 수정하려 하면 Strict Mode에서는 오류가 발생합니다.

"use strict";
const obj = {};
Object.defineProperty(obj, "prop", { value: 10, writable: false });

obj.prop = 20;  // 오류: 읽기 전용 속성을 수정할 수 없음

3.3. 삭제할 수 없는 속성 삭제 금지

Strict Mode에서는 객체의 비삭제 속성을 삭제하려 하면 오류가 발생합니다.

"use strict";
delete Object.prototype;  // 오류: Object.prototype을 삭제할 수 없음

3.4. 중복 매개변수 금지

함수에서 중복된 매개변수 이름을 사용하는 것이 금지됩니다.

"use strict";
function sum(a, a, c) {
    // 오류: 중복된 매개변수 이름
    return a + a + c;
}

3.5. `eval`과 `arguments` 사용 제한

Strict Mode에서는 **eval**과 arguments 객체의 동작이 제한됩니다.

eval: Strict Mode에서는 eval로 생성된 코드는 자신만의 스코프를 가지며, 외부 변수에 접근할 수 없습니다.
arguments: arguments 객체와 함수 매개변수는 별개의 값으로 처리됩니다. 즉, arguments로 전달된 값은 매개변수와 동기화되지 않습니다.

"use strict";
eval("let z = 2;");
console.log(z);  // 오류: z는 정의되지 않음 (eval 스코프 외부에서 접근 불가)

3.6. `with` 문 사용 금지

Strict Mode에서는 with 문을 사용할 수 없습니다. with 문은 특정 객체의 속성에 대해 여러 번 접근할 때 유용하지만, 코드의 가독성을 떨어뜨리고 디버깅을 어렵게 만듭니다.

"use strict";
with (Math) {
    x = cos(2);  // 오류: Strict Mode에서는 with 문을 사용할 수 없음
}

3.7. 함수 `this` 바인딩

Strict Mode에서는 함수 내에서의 this 값이 **undefined**로 설정됩니다. 기본적으로 함수에서 this는 전역 객체(브라우저 환경에서는 window)를 가리키지만, Strict Mode에서는 그렇지 않습니다.

"use strict";
function myFunction() {
    console.log(this);  // Strict Mode에서는 `undefined` 출력
}
myFunction();

4. Strict Mode와 함수

4.1. 함수 내부의 `this` 바인딩

Strict Mode에서는 생성자 함수가 아닌 일반 함수에서 **this는 undefined**로 설정됩니다. 반면, 생성자 함수에서 new 키워드로 호출되면 this는 새로 생성된 객체를 가리킵니다.

"use strict";
function regularFunction() {
    console.log(this);  // undefined
}
regularFunction();

function ConstructorFunction() {
    this.name = "John";
}
const obj = new ConstructorFunction();
console.log(obj.name);  // 출력: John

4.2. 함수 내 `arguments` 동작

Strict Mode에서는 함수의 arguments 객체가 매개변수와 동기화되지 않습니다. 즉, 매개변수의 값을 변경해도 arguments 객체에 영향을 주지 않습니다.

"use strict";
function demo(a) {
    a = 10;
    console.log(arguments[0]);  // 출력: 5 (매개변수와 동기화되지 않음)
}

demo(5);

5. Strict Mode의 장점

Strict Mode는 코드의 안전성과 디버깅을 돕고, 잠재적인 오류를 쉽게 찾아내는 데 도움을 줍니다. 이를 통해 다음과 같은 이점을 얻을 수 있습니다.

오류 탐지: 일반적인 JavaScript 모드에서는 무시되거나 감지되지 않는 오류를 감지할 수 있습니다.
보안 향상: 전역 객체에 의도하지 않은 변수나 속성을 추가하는 실수를 줄입니다.
최적화 가능성: 엄격 모드는 JavaScript 엔진이 코드를 더 최적화할 수 있도록 돕습니다.
가독성 개선: with 문과 같은 복잡한 구조의 사용을 금지하여 코드의 가독성을 높입니다.

요약

Strict Mode는 JavaScript의 엄격한 실행 모드로, 코드에서 잠재적인 오류를 줄이고 더 안전한 코드를 작성할 수 있도록 돕습니다.
"use strict" 지시어를 통해 전역 또는 함수 내에서 엄격 모드를 활성화할 수 있습니다.
주요 규칙: 선언되지 않은 변수 금지, 읽기 전용 속성 수정 금지, 중복 매개변수 금지, with 문 사용 금지 등.
함수 내 this 바인딩: Strict Mode에서는 함수 내 this가 전역 객체를 가리키지 않고, **undefined*로 설정됩니다.
엄격 모드를 사용하면 오류 탐지와 보안 향상, 그리고 코드 최적화에 도움이 됩니다.

Strict Mode는 JavaScript 코드의 안전성과 성능을 높이는 데 중요한 역할을 하므로, 최신 프로젝트나 프로덕션 코드에서 사용하는 것이 권장됩니다.

코딩 스쿨 JavaScript