자바스크립트

Section 6. 자바스크립트 전역 객체와 표준 빌트인 객체

포칼이 2023. 3. 30. 14:27

I. 전역 객체 global object

코드로 선언하거나 하지 않아도 전역 범위에 항상 존재하는 객체이다. 

console.log(this); 
//Window {window: Window, self: Window, document: document, name: '강남', location: Location, …}

console.log(
  this === window,
  window === self,
  self === frames
);//true true true

브라우저 콘솔에서 console.log(this)를 실행하면 많은 양의 객체들이 있는 것을 확인 할 수 있다. 

이렇게 따로 선언하지 않았음에도 아무때나 가져다 쓸 수 있는 객체들을 바로 전역 객체라고 한다.

 

전역 객체에 포함되는 것

1. 표준 빌트인 객체

2. 호스트 객체 - 환경에서 제공하는 기타 객체들 : 브라우저의 Web API, Node.js API등

3. (브라우저 한정) - 전역으로 설정된 var 변수와 전역 함수

 

II. 표준 빌트인 객체 standard built-in objects

특징은 다음과 같다

  • ECMAScript 사양에 정의된 객체들 - 어떤 환경에서든 사용가능한 객체들이다.
  • 전역 프로퍼티로 제공됨 - globalThis등을 붙이지 않고 바로 사용 가능하다.
// 그러나 요소들로 갖고 있는 것은 확인 가능
console.log(globalThis.Infinity);
console.log(globalThis.isNaN);
console.log(globalThis.Object);

// 그러나 요소들로 갖고 있는 것은 확인 가능
console.log(Infinity);
console.log(isNaN);
console.log(Object);

globalThis를 생략해도 출력문은 같다. 브라우저 콘솔창에서 직접 실행해보면 알 수 있다.

 

III. 래퍼 객체 wrapper object

const str = 'abcde';
console.log(
  str.length,
  str.toUpperCase(),
  str[0]
); //5 'ABCDE' 'a'

const num = 123.4567;
console.log(
  typeof num.toString(),
  num.toFixed(2)
); //string 123.46

str은 그냥 문자열인 원시값을 가지고 있다. 다른 기능이 아니라 문자열만 가지고 있다. 

근데 원시값을 가지고 있을 뿐인데 length, toUpperCase(), []배열처럼 접근이 가능한 것을 볼 수 있다. 또 출력을 해보면 정상적으로 출력이 되는 것을 알 수 있다. 

number도 마찬가지이다. toString이라는 메서드를 가지고 있고 toFixed라는 메서드도 가지고 있고 실행해 봤을때 정상적으로 실행이 된다. 

 

원시값이 어떻게 프로퍼티를 가지고 있는지 한번 살펴보면 다음과 같다.

const str = new String('abcde');
const num = new Number(123.4567);
const bool = new Boolean(true);

console.log(typeof str, str); //object String {'abcde'}
console.log(typeof num, num); //object Number {123.4567}
console.log(typeof bool, bool); //object Boolean {true}

문자열 abcde를 펼처보면 배열과도 같이 되어있는 것을 볼 수 있다. 그리고 프로토타입으로 많은 함수들이 있는 것을 볼 수 있다. 즉, 프로토타입을 통해 이런 함수들을 선언을 하지 않아도 언제든지 끌어다가 쓸 수 있는 것이다. 

 

*Number, String, Boolean 등은 표준 빌트인 객체에 속하는 래퍼 객체이다. 

  • 원시값을 필요시 래퍼객체로 감싸서 그것의 인스턴스로 만들어 기능을 실행한다
  • 원시값에서 객체를 사용하듯 해당 래퍼 객체의 프로퍼티를 호출할 때 래핑이 발생한다.

해당 기능 사용 후에는 원시 객체로 돌아간다. -메모리 절약

const str = 'abcde';
console.log(str.length); //5
console.log(typeof str, str); //string abcde

str.length를 했을때 만큼은 str이 string이란 타입의 객체가 되는 것이다(원래는 그냥 원시타입의 자료인데). 그리고 일이 끝나면 다시 원래 원시타입의 자료형으로 돌아가는 것을 볼 수 있다.