[JavaScript] 전역 객체 및 전역 변수 관리

전역 객체란

전역 객체는 자바스크립트 환경에서 어디서든 접근할 수 있는 내장 객체로, 전역에서 사용 가능한 변수와 함수들을 담고 있습니다.

  • 브라우저 환경: 전역 객체는 window로 불리며, window.document, window.setTimeout() 등으로 접근할 수 있습니다.
  • Node.js 환경: 전역 객체는 global로 불리며, global.process, global.setImmediate() 등을 제공합니다.

브라우저와 Node.js에서의 전역 객체 사용

// 브라우저 환경에서의 전역 객체

// 전역 함수 호출 (window 객체의 메서드)
window.alert("안녕하세요!");

// window를 생략해도 동일하게 동작합니다.
alert("안녕하세요!");

// Node.js 환경에서의 전역 객체

// 전역 변수에 접근
console.log(global.process.version);

// global을 생략해도 전역 객체의 프로퍼티에 접근할 수 있습니다.
console.log(process.version);

전역 변수와 전역 객체의 관계

전역 변수의 사용을 최소화하는 것이 좋습니다. 그러나 전역 변수가 필요한 경우, 변수 선언 방식에 따라 전역 객체와의 관계를 이해해야 합니다.

var로 선언한 전역 변수

var로 선언한 전역 변수는 자동으로 전역 객체의 프로퍼티가 됩니다.

var globalVar = 42;
console.log(window.globalVar); // 42

let과 const로 선언한 전역 변수

let과 const로 선언한 전역 변수는 전역 스코프에 존재하지만, 전역 객체의 프로퍼티가 아닙니다.

let globalLet = 42;
const globalConst = "Hello";

console.log(window.globalLet);   // undefined
console.log(window.globalConst); // undefined

전역 객체에 직접 프로퍼티 추가하기

전역 변수를 반드시 전역 객체의 프로퍼티로 만들어야 하는 상황이라면, 전역 객체에 직접 할당할 수 있습니다.

// 전역 객체(window)에 직접 프로퍼티 추가하기
window.currentUser = {
  name: "John Doe",
  role: "admin"
};

console.log(currentUser.name);         // "John Doe"
// 지역 변수와 충돌할 경우에도 명시적으로 window를 사용하면 전역 프로퍼티에 접근할 수 있습니다.
console.log(window.currentUser.role);    // "admin"

전역 객체의 활용: 폴리필(polyfill)

전역 객체는 최신 기능 지원 여부를 확인하거나, 부족한 기능을 보완하는 폴리필을 추가하는 데도 활용됩니다.

// Promise가 없는 환경에서 Promise 폴리필 적용
if (typeof Promise === "undefined") {
  window.Promise = /* Promise 폴리필 코드 */;
}