[JavaScript] 모던 자바스크립트 Deep Dive 14장 - 전역 변수의 문제점

2022. 7. 20. 20:12Web/JavaScript


14.1 변수의 생명 주기

14.1.1 지역 변수의 생명 주기

지역 변수의 생명 주기 = 함수 호출되면 생성되고 종료시 소멸

var x = 'global';

function foo() {
    console.log(x); // undefined
    var x = 'local';
}

foo();
console.log(x); // global

undefined가 출력된 이유: 변수 할당문이 실행되기 이전까지는 undefined 값을 갖는다.


14.1.2 전역 변수의 생명 주기

전역 변수의 생명 주기 = 애플리케이션의 생명 주기


14.2 전역 변수의 문제점

1. 암묵적 결함: 모든 코드가 전역 변수를 참조하고 변경할 수 있도록 허용하는 것(가독성이 나빠지고 의도치 않게 상태 변경)

 

2. 긴 생명 주기: 메모리 리소스가 오랜 기간 소비

 

3. 스코프 체인 상에서 종점에 존재: 변수를 검색할 때 전역 변수가 가장 마지막에 검색된다. 즉, 전역 변수의 검색 속도가 가장 느리다.

 

4. 네임스페이스 오염: 다른 파일 내에서 동일한 이름으로 명명된 전역 변수나 전역 함수가 같은 스코프 내에서 존재할 수 있다.


14.3 전역 변수의 사용을 억제하는 방법

변수의 스코프는 좁을수록 좋기 때문에 전역 변수를 꼭 사용해야 할 이유를 찾지 못한다면 지역 변수를 사용

 

14.3.1 즉시 실행 함수

(function() {
    var foo = 10; // 즉시 실행 함수의 지역 변수
}());

console.log(foo); // ReferenceError: foo is not defined

14.3.2 네임 스페이스 객체

전역에 네임스페이스 역할을 담당할 객체를 생성하고 전역 변수처럼 사용하고 싶은 변수를 프로퍼티로 추가하는 방법

var MYAPP = {}; // 전역 네임스페이스 객체

MYAPP.name = 'Eo';

console.log(MYAPP.name); // Eo