모던 자바스크립트 Deep Dive - 21. 빌트인 객체

21.1. 자바스크립트 객체의 분류

• 표준 빌트인 객체
  • ECMAScript 사양에 정의된 객체
  • 애플리케이션 전역의 공통 기능 제공
  • 자바스크립트 실행 환경 (브라우저 또는 Node.js) 무관하게 사용
  • 전역 객체의 프로퍼티로서 제공
  • 별도의 선언 없이 전역 변수처럼 사용
• 호스트 객체
  • 자바스크립트 실행 환경 (브라우저 환경 또는 Node.js 환경)에서 추가로 제공하는 객체
  • 브라우저 환경: DOM, BOM, Canvas, XMLHttpRequest, fetch 등과 같은 클라이언트 사이드 Web API
  • Node.js 환경: Node.js 고유의 API
• 사용자 정의 객체
  • 사용자가 직접 정의한 객체

21.2. 표준 빌트인 객체

• Object, String, Number, Boolean 등 40여 개의 표준 빌트인 객체 제공
• Math, Reflect, JSON 제외하고 모두 인스턴스를 생성할 수 있는 생성자 함수 객체
  • 생성자 함수 객체인 경우 프로토타입 메서드와 정적 메서드 제공
  • 아닌 경우 정적 메서드만 제공
• 생성자 함수가 생성한 인스턴스의 프로토타입은 표준 빌트인 객체의 prototype 프로퍼티에 바인딩된 객체
  • ex. String('Lee')의 프로토타입은 String.prototype
• 표준 빌트인 객체는 인스턴스 없이도 호출 가능한 빌트인 정적 메서드 제공

21.3. 원시값과 래퍼 객체

• 표준 빌트인 생성자 함수가 존재하는 이유
  • 원시값인 문자열, 숫자, 불리언 값은 객체처럼 마침표 표기법(또는 대괄호 표기법)으로 접근 시 암묵적으로 연관된 객체로 변환하여 사용됨
  • 객체처럼 접근하면 생성되는 임시 객체를 래퍼 객체(wrapper object)라고 함
  • 래퍼 객체의 처리가 종료되면 원시값으로 되돌리고 래퍼 객체는 가비지 컬렉션의 대상이 됨
    • 문자, 숫자, 불리언, 심벌 값은 래퍼 객체 생성
    • null, undefined는 래퍼 객체를 생성하지 않고 에러 발생

// 1. 식별자 str은 문자열 값을 가짐
const str = 'hello';

// 2. str은 암묵적으로 생성된 래퍼 객체를 가리킴
//    기존 값인 'hello'는 래퍼 객체의 [[StringData]] 내부 슬롯에 할당
//    래퍼 객체에 name 프로퍼티가 동적으로 추가됨
str.name = 'Lee';

// 3. str은 [[StringData]] 내부 슬롯에 할당되어 있던 원래의 문자열을 가짐
//    2에서 생성된 래퍼 객체는 아무도 참조하지 않는 상태로 가비지 컬렉션의 대상

// 4. str은 암묵적으로 새롭게 생성된 (2의 래퍼 객체와 다른) 래퍼 객체를 가리킴
//    새롭게 생성된 래퍼 객체에는 name 프로퍼티가 존재하지 않으므로 undefined
console.log(str.name); // undefined

// 5. str은 원래의 문자열 원시값을 가짐
//    4에서 생성된 래퍼 객체는 아무도 참조하지 않는 상태로 가비지 컬렉션의 대상
console.log(typeof str, str); // string hello;

21.4. 전역 객체

• 전역 객체는 가장 먼저 생성되는 특수한 최상위 객체
  • 전역 객체 자신은 어떠한 객체의 프로퍼티도 아니며,
  • 객체의 계층적 구조상 표준 빌트인 객체와 호스트 객체를 프로퍼티로 소유한다는 의미
• 전역 객체는 표준 빌트인 객체와 환경에 따른 호스트 객체, var 키워드로 선언한 전역 변수와 함수를 프로퍼티로 가짐
• 자바스크립트 환경에 따라 이름이 다름
  • 브라우저 환경: window, self, this, frames
  • Node.js 환경: global
• 전역 객체의 특징
  • 개발자가 의도적으로 생성할 수 없음, 생성자 함수 제공되지 않음
  • 전역 객체의 프로퍼티 참조 시 window (또는 global) 생략 가능
  • 모든 표준 빌트인 객체를 프로퍼티로 가짐
  • 자바스크립트 실행 환경에 따라 추가적으로 프로퍼티와 메서드를 가짐
  • var 키워드 전역 변수, 암묵적 전역, 전역 함수는 전역 객체의 프로퍼티
    • let, const로 선언한 전역 변수는 전역 객체의 프로퍼티가 아님 -> 렉시컬 환경 내 존재
  • 브라우저 환경의 모든 자바스크립트 코드는 하나의 전역 객체 window 공유함

21.4.1. 빌트인 전역 프로퍼티

• 빌트인 전역 프로퍼티: 전역 객체의 프로퍼티, 애플리케이션 전역에서 사용하는 값 제공

Infinity

• 무한대를 나타내는 숫자값을 가짐

NaN

• 숫자가 아님을 나타내는 숫자값 NaN을 가짐
• Number.NaN 프로퍼티와 같음

undefined

• 원시 타입 undefined를 값으로 가짐

21.4.2. 빌트인 전역 함수

• 빌트인 전역 함수: 전역 객체의 메서드, 애플리케이션 전역에서 호출할 수 있는 빌트인 함수

eval

• 전달받은 문자열 코드가 표현식이라면 런타임에 평가하여 값을 생성
• 표현식이 아닌 문이라면 문자열 코드를 런타임에 실행
• 여러 개의 문으로 이루어져 있다면 모든 문을 실행하고 마지막 결과값 반환
• 자신이 호출된 위치에서 기존의 스코프를 런타임에 동적으로 수정
  • strict mode에서는 자체적인 스코프 생성
  • 전달받은 문자열이 let, const 키워드라면 암묵적으로 strict mode 적용
• 보안에 매우 취약하므로 사용 금지

isFinite

• 전달받은 인수가 유한수(true)인지 확인하여 결과 반환 (무한수인 경우 false)
• isFinite(null): true -> null을 숫자로 변환하면 0

isNaN

• 전달받은 인수가 NaN인지 확인하여 결과 반환
  • 숫자 아니면 true, 숫자면 false
• 숫자 타입이 아니면 강제 타입 변환하여 수행

parseFloat

• 전달받은 문자열 인수를 부동 소수점 숫자(실수)로 해석하여 반환
  • 공백으로 구분된 문자열은 첫 번째 문자열만 반환
  • 숫자로 변환할 수 없다면 NaN 반환
  • 앞뒤 공백 무시

parseInt

• 전달받은 문자열 인수를 정수로 해석하여 반환
  • 전달받은 인수가 문자열이 아니면 -> 문자열 -> 정수 변환
  • 변환할 수 없다면 NaN 반환
• 두 번째 인수로 진법 기수(2~36) 전달 가능, 기본 값 10 진수
• 공백이나 해석할 수 없는 문자들은 모두 무시되며 해석된 정수값만 반환함

encodeURI / decodeURI

• encodeURI
  • URI를 문자열로 전달받아 이스케이프 처리를 위해 인코딩함
    • 전달된 문자열을 완전한 URI 전체로 간주함
    • 쿼리 스트링 구분자(=, ?, &)는 인코딩하지 않음
  • 이스케이프: 어떤 시스템에서나 읽을 수 있는 아스키 문자 셋으로 변환하는 것
    • ex. '가' -> %EC%9E%90
  • URI 문법 형식 표준에 따르면 URI는 아스키 문자 셋으로만 구성되어야 함
    • 알파벳, 0~9 숫자, - _ . ! ~ * ' ( ) 문자 제외
• decodeURI
  • 인코딩된 URI를 전달받아 이스케이프 이전으로 디코딩함

encodeURIComponent / decodeURIComponent

• URI 구성 요소(component)를 전달 받아 인코딩
  • 전달된 문자열을 URI의 구성 요소인 쿼리 스트링의 일부로 간주함
  • 쿼리 스트링 구분자(=, ?, &)까지 인코딩

21.4.3.암묵적 전역

• 선언하지 않은 식별자에 값을 할당하면 자바스크립트 엔진은 전역 객체의 프로퍼티로 동적 생성하고, 전역 변수처럼 동작하게 됨
• But, 변수 선언 없이 전역 객체의 프로퍼티로만 추가됨
  • 변수가 아님 -> 변수 호이스팅 X
  • delete 연산자로 삭제 가능
    
    

[출처] 모던 자바스크립트, Deep Dive