자바스크립트 window, global 객체

[ 목적 ]

자바스크립트를 좀 더 잘 이해한다.

[ window 객체란? ]

Browser에서의 최상위 객체(전역 객체)이며 node에서는 window객체는 존재하지 않고 global객체가 존재한다.

window객체는 실행 컨텍스트에 작업이 들어가기 전에 생성되고 생성자가 없기 때문에 new로 생성을 할 수 없다.

document.getElementById('test').style.display = 'none';
// window.document.getElementById('test').style.display = 'none';

window객체의 자식 객체를 사용할 경우에는 window를 위와 같이 생략할 수 있다. 하지만 사용자 정의 함수, 변수와 이름이 충돌할 경우, window를 생략하지 않고 전역 객체를 기입하여 충돌을 방지할 수 있다.

[ global 객체 ]

nodejs에서의 최상위 객체를 의미한다. 브라우저에 window가 있듯, nodejs에서는 global이 있고.

브라우저에 콘솔탭이 있듯, nodejs에는 repl 콘솔을 통해 자바스크립트 실행을 확인할 수 있다.

브라우저에서 window를 생략할 수 있듯, nodejs에서도 global 키워드를 생략할 수 있고, 내장된 속성, 함수는 다음과 같다.

여기서도 마찬가지로 global.a = 3을 하게 되면 globalThis를 실행했을 경우 a라는 속성에 3이라는 값이 들어가 있다.

<ref *1> Object [global] {
  global: [Circular *1],
  queueMicrotask: [Function: queueMicrotask],
  clearImmediate: [Function: clearImmediate],
  setImmediate: [Function: setImmediate] {
    [Symbol(nodejs.util.promisify.custom)]: [Getter]
  },
  structuredClone: [Function: structuredClone],
  clearInterval: [Function: clearInterval],
  clearTimeout: [Function: clearTimeout],
  setInterval: [Function: setInterval],
  setTimeout: [Function: setTimeout] {
    [Symbol(nodejs.util.promisify.custom)]: [Getter]
  },
  atob: [Function: atob],
  btoa: [Function: btoa],
  performance: Performance {
    nodeTiming: PerformanceNodeTiming {
      name: 'node',
      entryType: 'node',
      startTime: 0,
      duration: 27.949199974536896,
      nodeStart: 1.9319000244140625,
      v8Start: 4.324999988079071,
      bootstrapComplete: 21.26929998397827,
      environment: 11.06029999256134,
      loopStart: -1,
      loopExit: -1,
      idleTime: 0
    },
    timeOrigin: 1693141773590.564
  },
  fetch: [AsyncFunction: fetch]
}
<ref *1> Object [global] {
  global: [Circular *1],
  queueMicrotask: [Function: queueMicrotask],
  clearImmediate: [Function: clearImmediate],
  setImmediate: [Function: setImmediate] {
    [Symbol(nodejs.util.promisify.custom)]: [Getter]
  },
  structuredClone: [Function: structuredClone],
  clearInterval: [Function: clearInterval],
  clearTimeout: [Function: clearTimeout],
  setInterval: [Function: setInterval],
  setTimeout: [Function: setTimeout] {
    [Symbol(nodejs.util.promisify.custom)]: [Getter]
  },
  atob: [Function: atob],
  btoa: [Function: btoa],
  performance: Performance {
    nodeTiming: PerformanceNodeTiming {
      name: 'node',
      entryType: 'node',
      startTime: 0,
      duration: 29.099900007247925,
      nodeStart: 1.9319000244140625,
      v8Start: 4.324999988079071,
      bootstrapComplete: 21.26929998397827,
      environment: 11.06029999256134,
      loopStart: -1,
      loopExit: -1,
      idleTime: 0
    },
    timeOrigin: 1693141773590.564
  },
  fetch: [AsyncFunction: fetch]
}
<ref *1> Object [global] {
  global: [Circular *1],
  queueMicrotask: [Function: queueMicrotask],
  clearImmediate: [Function: clearImmediate],
  setImmediate: [Function: setImmediate] {
    [Symbol(nodejs.util.promisify.custom)]: [Getter]
  },
  structuredClone: [Function: structuredClone],
  clearInterval: [Function: clearInterval],
  clearTimeout: [Function: clearTimeout],
  setInterval: [Function: setInterval],
  setTimeout: [Function: setTimeout] {
    [Symbol(nodejs.util.promisify.custom)]: [Getter]
  },
  atob: [Function: atob],
  btoa: [Function: btoa],
  performance: Performance {
    nodeTiming: PerformanceNodeTiming {
      name: 'node',
      entryType: 'node',
      startTime: 0,
      duration: 29.550899982452393,
      nodeStart: 1.9319000244140625,
      v8Start: 4.324999988079071,
      bootstrapComplete: 21.26929998397827,
      environment: 11.06029999256134,
      loopStart: -1,
      loopExit: -1,
      idleTime: 0
    },
    timeOrigin: 1693141773590.564
  },
  fetch: [AsyncFunction: fetch]
}