[모던 자바스크립트 딥다이브] 21장 빌트인 객체

자바스크립트 객체의 분류

• 표준 빌트인 객체
  • ECMAScript 사양에 정의된 객체
  • 자바스크립트 실행 환경과 관계없이 사용 가능
  • 전역 객체의 프로퍼티로서 제공
  • 별도의 선언 없이 전역 변수처럼 언제나 참조 가능
• 호스트 객체
  • 자바스크립트 실행 환경에서 추가로 제공하는 객체
  • 브라우저 : DOM, BOM, Canvas, XMLHttpRequest, fetch, requestAnimationFrame, SVG, Web Storage, Web Component, Web Worker 같은 클라이언트 사이드 API 제공함
  • Node.js : Node.js 고유의 API를 호스트 객체로 제공
• 사용자 정의 객체
  • 사용자가 직접 정의한 객체

 

표준 빌트인 객체

• 자바스크립트는 Object, String, Promise, Reflect 등 40여 개의 표준 빌트인 객체 제공
• Math, Reflect, JSON을 제외한 모든 표준 빌트인 객체는 인스턴스를 생성할 수 있는 생성자 함수 객체, 프로토타입 메서드와 정적 메서드 제공
• 생성자 함수 객체가 아닌 표준 빌트인 객체는 정적 메서드만 제공

 

원시값과 래퍼 객체

• 문자열, 숫자, 불리언 등 원시값이 존재하는데 문자열, 숫자, 불리언 객체를 생성하는 표준 빌트인 생성자 존재하는 이유?
• 원시값은 객체가 아니므로 프로퍼티나 메서드를 가질수 없는데도 객체처럼 동작함
• 마침표 표기법으로 접근하면 자바스크립트 엔진이 일시적으로 원시값과 연관된 객체로 변환해주기 때문 (다시 원시값으로 되돌림)
• 문자열, 숫자, 불리언 값에 대해 객체처럼 접근하면 생성되는 임시객체를 래퍼 객체라고 함
• 래퍼 객체의 처리가 종료되면 래퍼 객체의 [[StringDate]] 내부 슬롯에 할당된 원시값으로 원래의 상태, 즉 식별자가 원시값을 갖도록 되돌리고 래퍼 객체는 가비지 컬렉션의 대상이 됨
• null과 undefined는 래퍼 객체 생성하지 않음

const str = 'hello'; // 원시 값

// 원시 타입인 문자열이 프로퍼티와 메서드를 갖고 있는 객체처럼 동작함
console.log(str.length); // 5

 

 

전역 객체

• 코드가 실행되기 이전 단계에 자바스크립트 엔진에 의해 어떤 객체보다도 먼저 생성되는 특수한 객체
• 어떤 객체에도 속하지 않은 최상위 객체
• 브라우저 환경에서는 window
• Node.js 환경에서는 global
• 전역 객체는 표준 빌트인 객체와 환경에 따른 호스트 객체, 그리고 var 키워드로 선언한 전역 변수와 전역 함수를 프로퍼티로 갖음
• 전역 객체는 개발자가 의도적으로 생성할 수 없음
• 전역 객체를 생성하는 생성자 함수가 제공되지 않음
• 전역 객체의 프로퍼티를 참조할 때 객체이름을 생략할 수 있음
• let과 const 키워드로 선언한 변수는 전역 객체의 프로퍼티가 아님, let, const로 선언한 전역 변수는 보이지 않는 개념적인 블록(전역 렉시컬 환경의 선언적 환경 레코드) 내에 존재함
• 브라우저 환경의 모든 자바스크립트 코드는 하나의 전역 객체를 공유함

ES11에 도입된 globalThis는 브라우저 환경과 Node.js 환경에서 전역 객체를 가리키는 다양한 식별자를 통일한 식별자

 

 

빌트인 전역 프로퍼티

• 전역 객체의 프로퍼티
• Infinity : 무한대를 나타내는 숫자값
• NaN : 숫자가 아님을 나타내는 숫자값, Number.NaN와 같음
• undefined : 원시 타입 undefined를 값으로 갖음

 

빌트인 전역 함수

• 애플리케이션 전역에서 호출 가능한 빌트인 함수로서 전역 객체의 메서드

 

eval

• 자바스크립트 코드를 나타내는 문자열을 인수로 전달받음
• 전달받은 문자열 코드가 표현식이라면 문자열 코드를 런타임에 평가하여 값을 생성
• 표현식이 아닌 문이라면 문자열 코드를 런타임에 실행
• 문자열 코드가 여러 개의 문이라면 모든 문 실행
• eval 함수는 자신이 호출된 위치에 해당하는 기존의 스코프를 런타임에 동적으로 수정함
• strict mode에서는 기존의 스코프를 수정하지 않고 자신의 자체적인 스코프를 생성함

//표현식인 문
eval('1+2'); // 3

// 표현식이 아닌 문
eval('var x = 5;'); // undefined

// eval 함수에 의해 런타임에 변수 선언문이 실행되어 x 변수가 선언됨
console.log(x); // 5

//객체 리터럴과 함수 리터럴은 반드시 괄호로 둘러쌈
const o = eval('({a : 1})');

const x = 1;

function foo() {
	// 런타임에 foo 함수의 스코프를 동적으로 수정함
	eval('var x = 2;');
    console.log(x); // 2
}

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

 

 

isFinite

• 전달받은 인수가 정상적인 유한수면 true, 무한수이면 false, NaN이여도 false
• null 이면 true를 반환함 숫자로 변환할 때 0이기 때문

 

isNaN

• 전달받은 인수가 NaN인지 검사하여 그 결과를 불리언 타입으로 변환함

 

parseFloat

• 전달받은 문자열 인수를 부동 소수점 숫자, 즉 실수로 해석해서 반환

 

parseInt

• 전달받은 문자열 인수를 정수로 해석해서 반환
• 두번째 인수로 진법을 나타내는 기수를 전달할 수 있음 하지만, 반환값은 언제나 10진수임
• 10진수 숫자를 해당 기수의 문자열로 변환하여 반환하고 싶으면 Number.prototype.toString 메서드를 사용하면 됨

 

encodeURI / decodeURI

• encodeURI : 완전한 URI를 문자열로 전달받아 이스케이프 처리를 위해 인코딩
• 이스케이프 처리 : 네트워크를 통해 정보를 공유할 때 어떤 시스템에서도 읽을 수 있는 아스키 문자 셋으로 변환하는 것
• decodeURI : 인코딩된 URI를 인수로 전달받아 이스케이프 처리 이전으로 디코딩

 

encodeURIComponent / decodeURIComponent

• encodeURIComponent  : URI 구성 요소를 인수로 전달받아 인코딩
• 이스케이프 처리 : 네트워크를 통해 정보를 공유할 때 어떤 시스템에서도 읽을 수 있는 아스키 문자 셋으로 변환하는 것
• decodeURI : URI 구성요소를 디코딩

 

암묵적 전역

• 선언하지 않은 식별자를 마치 선언된 전역 변수처럼 동작하는 것
• 선언하지 않은 식별자에 값을 할당하면 전역 객체의 프로퍼티가 됨
• 해당 값은 변수는 아님