[모던 JS Deep Dive] 21장 - 빌트인 객체

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

  - 표준 빌트인 객체 (Standard built-in objects / native objects / global objects)

    - ECMAScript 사양에 정의된 객체, 애플리케이션 전역의 공통 기능 제공

    - JS 실행 환경 관계없이 언제나 사용 가능, 전역 객체의 프로퍼티로서 제공됨

    - 별도의 선언 없이 전역 변수처럼 언제나 참조 가능

  - 호스트 객체 (host objects)

    - ECMAScript 사양에 정의되어 있지 않음, JS 실행 환경에서 추가로 제공하는 객체

    - 브라우저 환경; DOM, BOM, Canvas, XHR, fetch, requestAnimationFrame, SVG, Web Storage, ...

    - Node.js 환경; Node.js 고유 API

  - 사용자 정의 객체 (user-defined objects)

    - 사용자가 직접 정의한 객체

21.2 표준 빌트인 객체

  - JS는 약 40여개의 표준 빌트인 객체 제공 ex. Object, String, Number, RegExp, ...

  - Math, Reflect, JSON 제외한 표준 빌트인 객체 => 인스턴스 생성할 수 있는 생성자 함수 객체

  - 생성자 함수 객체인 표준 빌트인 객체는 프로토타입 메서드와 정적 메서드 제공

  - 생성자 함수 객체가 아닌 표준 빌트인 객체는 정적 메서드만 제공

  - 생성자 함수인 표준 빌트인 객체가 생성한 인스턴스의 프로토타입은

    표준 빌트인 객체의 prototype 프로퍼티에 바인딩된 객체임

    - ex) new String()을 이용해서 생성한 인스턴스의 프로토타입 => String.prototype

    - 표준 빌트인 객체의 prototype 프로퍼티에 바인딩된 객체 => 다양한 기능의 빌트인 프로토타입 메서드 제공

      - 모든 인스턴스가 상속을 통해 사용 가능

    - 표준 빌트인 객체는 인스턴스 없이도 호출 가능한 빌트인 정적 메서드 제공

21.3 원시값과 래퍼 객체

  - 원시값이 있는데 래퍼 객체를 생성하는 표준 빌트인 생성자 함수 존재하는 이유?

  - JS 엔진이 일시적으로 원시값을 연관된 객체로 변환해줌 (원시 타입으로 프로퍼티나 메서드 사용 가능)

  - 원시값을 객체처럼 사용 시 JS 엔진은 암묵적으로 연관된 객체를 생성하여 생성된 객체로

    프로퍼티에 접근하거나 메서드를 호출하고 다시 원시값으로 되돌림

  - 문자열, 숫자, 불리언 값에 대해 객체처럼 접근하면 생성되는 임시 객체 => 래퍼 객체

    - ex) 문자열.프로퍼티 => 그 순간 래퍼 객체인 String 생성자 함수의 인스턴스가 생성되고

      문자열은 래퍼 객체의 [[StringData]] 내부 슬롯에 할당됨

    - 문자열 래퍼 객체인 String 생성자 함수의 인스턴스는 String.prototype 메서드 상속받아 사용 가능

    - 그 후 래퍼 객체의 처리 종료 시 래퍼 객체의 [[StringData]] 내부 슬롯에 할당된 원시값으로 원래 상태

      되돌리고 래퍼 객체는 가비지 컬렉션의 대상이 됨 (생성된 래퍼 객체 아무도 참조 X -> GC 대상)

  - ES6에서 새롭게 도입된 원시값인 Symbol도 래퍼 객체 생성함

    - 심벌은 리터럴 표기법으로 생성 불가, Symbol 함수를 통해 생성 가능

  - 표준 빌트인 객체인 String, Number, Boolean, Symbol의 프로토타입 메서드/프로퍼티 참조 가능

  - String, Number, Boolean 생성자 함수를 new 연산자와 함께 호출하여 문자열, 숫자, 불리언 인스턴스를

    생성할 필요가 없으며 권장 X (Symbol은 생성자 함수가 아님)

  - null과 undefined는 래퍼 객체 생성 X (에러 발생)

21.4 전역 객체

  - 전역 객체: 코드가 실행되기 이전 단계에 JS 엔진에 의해 가장 먼저 생성되는 특수한 객체 (최상위 객체)

    - 브라우저 환경; window, self, this, frames

    - Node.js 환경; global

    - ES11 globalThis (표준 사양)

    - 전역 객체 => 표준 빌트인 객체, 환경에 따른 호스트 객체,

                         var 키워드로 선언한 전역 변수와 전역 함수를 프로퍼티로 가짐 (+ 암묵적 전역)

    - 전역 객체는 모든 빌트인 객체(표준 빌트인 객체와 호스트 객체)의 최상위 객체

      - 프로토타입 상속 관계상 최상위 객체를 의미하는 건 아님

      - 전역 객체 자신은 어떤 객체의 프로퍼티도 아니고,

        객체의 계층적 구조상 표준 빌트인 객체와 호스트 객체를 프로퍼티로 소유

    - 전역 객체는 모든 표준 빌트인 객체를 프로퍼티로 가지고 있음

    - 암묵적 전역; 전역 변수가 아니라 전역 객체의 프로퍼티

    - 브라우저 환경의 모든 JS 코드는 하나의 전역 객체 window 공유 (스크립트 분리되어 있어도 하나의 전역 공유)

  - 빌트인 전역 프로퍼티

    - 전역 객체의 프로퍼티 (주로 애플리케이션 전역에서 사용하는 값 제공)

    - Infinity

      - 무한대를 나타내는 숫자값 Infinity를 가짐

      - number 타입

    - NaN

      - Not a Number (숫자가 아님)를 나타냄

      - Number.NaN 과 동일

      - number 타입

    - undefined

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

      - undefined 타입

  - 빌트인 전역 함수

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

    - eval

      - JS 코드를 나타내는 문자열을 인수로 전달받음

      - 전달받은 문자열 코드가 표현식이라면 eval 함수는 문자열 코드를 런타임에 평가하여 값 생성

      - 표현식이 아닌 문이면 eval 함수는 문자열 코드를 런타임에 실행함

      - 변수 선언문은 표현식이 아닌 문임

      - 객체 리터럴, 함수 리터럴은 반드시 소괄호로 둘러쌈

      - eval 함수는 자신이 호출된 위치에 해당하는 기존의 스코프를 런타임에 동적으로 수정함

        - strict mode 에서 eval 함수는 기존의 스코프 수정하지 않고 eval 함수 자신의 자체적인 스코프 생성

      - 인수로 전달받은 문자열 코드가 let, const 키워드 사용한 변수 선언문 => 암묵적으로 strict mode 적용됨

      - eval 함수 사용 금지! (보안 취약, JS 엔진 최적화 안되어 처리 속도 느림)

    - isFinite

      - 전달받은 인수가 정상적인 유한수인지 체크

      - 전달받은 인수 타입이 숫자가 아니면 숫자로 타입 변환 후 검사 수행

      - null 을 숫자 타입으로 변환하면 0

    - isNaN

      - 전달받은 인수가 NaN인지 검사

      - 전달받은 인수 타입이 숫자가 아니면 숫자로 타입 변환 후 검사 수행

    - parseFloat

      - 전달받은 문자열 인수를 부동 소수점 숫자(실수)로 해석하여 반환

    - parseInt

      - 전달받은 문자열 인수를 정수로 해석하여 반환

      - 전달받은 인수가 문자열이 아니면 문자열로 변환 후 정수로 해석해서 반환

      - 두번째 매개변수(기수) 생략 시 첫번째 인수로 전달된 문자열을 10진수로 해석해서 반환

      - 결과는 항상 10진수 정수로 반환

      - 기수를 지정하여 10진수 숫자를 해당 기수의 문자열로 변환하고 싶으면 Number.prototype.toString() 이용

      - 두번째 매개변수 지정 안하고 첫번째 매개변수의 문자열이 16진수 리터럴이면 그에 맞게 해석해줌 (0x)

        - 2, 8진수는 제대로 해석 못함 (0b, 0o 불가)

    - encodeURI / decodeURI

      - encodeURI: 완전한 URI를 문자열로 전달받아 이스케이프 처리를 위한 인코딩

        - URI: 인터넷에 있는 자원을 나타내는 유일한 주소 (URL, URN은 URI의 하위 개념)

        - 인코딩: URI의 문자들을 이스케이프 처리하는 것

        - 이스케이프 처리: 네트워크를 통해 정보 공유 시 어떤 시스템에서도 읽을 수 있는 아스키 문자 셋으로 변환

        - UTF-8: 특수 문자는 1~3바이트, 한글은 3바이트

      - decodeURI: 인코딩된 URI를 인수로 전달받아 이스케이프 처리 이전으로 디코딩

    - encodeURIComponent / decodeURIComponent

      - encodeURIComponent: URI component를 인수로 전달받아 인코딩

        - 인수로 전달된 문자열을 URI의 구성 요소인 쿼리 스트링의 일부로 간주 (쿼리 스트링 구분자까지 인코딩)

        - encodeURI 함수는 쿼리 스트링 구분자는 인코딩하지 않음 (URI 전체로 간주)

        - 쿼리 스트링 구분자: =, ?, &

      - decodeURIComponent: 매개변수로 전달된 URI component를 디코딩

  - 암묵적 전역

    - 전역 객체에 프로퍼티를 동적으로 생성

    - 전역 변수처럼 동작하지만 변수는 아님! => 호이스팅 발생하지 않음!!!

    - 전역 객체의 프로퍼티 이므로 delete 연산자로 삭제 가능

      - 전역 변수는 delete 연산자로 삭제 불가

    - 전역 프로퍼티와 전역 변수는 다른 개념!

      - 전역 변수도 window 붙여서 사용 가능