[딥다이브] 빌트인 객체

yunji_kim·2023년 3월 30일
0

해당 포스팅은 위키북스의 '모던 자바스크립트 Deep Dive'를 읽고 공부한 개념을 정리한 글입니다.

21장 빌트인 객체

자바스크립트 객체의 분류

  • 표준 빌트인 객체
    ECMAScript 사양에 정의된 객체를 말하며, 애플리케이션 전역의 공통 기능을 제공한다.
  • 호스트 객체
    자바스크립트 실행 환경에서 추가로 제공하는 객체이다.
    브라우저 환경 - DOM, BOM, Canvas, XMLHttpRequest, fetch, requestAnimationFrame, SVG, Web Storage, Web Component, Web Worker와 같은 Web API
    Node.js - Node.js 고유의 API
  • 사용자 정의 객체
    기본 제공되는 객체가 아닌 사용자가 직접 정의한 객체를 말한다.

표준 빌트인 객체

  • 자바스크립트는 Object, String, Number, Boolean 등 40여개의 표준 빌트인 객체를 제공한다.
  • Math, Reflect, JSON을 제외한 모든 표준 빌트인 객체는 인스턴스를 생성할 수 있는 생성자 함수 객체이다.
  • 생성자 함수 객체인 표준 빌트인 객체는 프로토타입 메서드(예 - toFixed)와 정적 메서드(예 - isInteger)를 제공하며, 생성자 함수가 아닌 표준 빌트인 객체(Math, Reflect, JSON)는 정적 메서드만 제공한다.

원시값과 객체 래퍼

원시값은 객체가 아니므로 프로퍼티나 메서드를 가질 수 없는데도 마치 객체처럼 동작한다.

const str = 'hi';

// 원시 타입인 문자열이 래퍼 객체인 String 인스턴스로 변환된다.
console.log(str.length); // 2
console.log(str.toUpperCase()); // HI

// 래퍼 객체로 프로퍼티에 접근하거나 메서드를 호출한 후, 다시 원시값으로 되돌린다.
console.log(typeof str); // string

이는 원시값을 객체처럼 사용하면 자바스크립트 엔진이 암묵적으로 연관된 객체를 생성하여 생성된 객체로 프로퍼티에 접근하거나 메서드를 호출하고 다시 원시값으로 되돌리기 때문이다.

이처럼 문자열, 숫자, 불리언 값에 대해 객체처럼 접근하면 생성되는 임시 객체를 래퍼 객체wrapper object라고 한다. 래퍼 객체의 처리가 종료되면 래퍼 객체는 가비지 컬렉션의 대상이 된다.

null, undefined는 래퍼 객체를 생성하지 않는다.

전역 객체

  • 코드가 실행되기 이전 단계에 어떤 객체보다도 먼저 생성되는 특수한 객체로, 어떤 객체에도 속하지 않은 최상위 객체이다.
  • 전역 객체는 표준 빌트인 객체, 환경에 따른 호스트 객체, var 키워드로 선언한 전역 변수와 전역 함수를 프로퍼티로 갖는다. (let, const로 선언한 전역 변수는 전역 객체의 프로퍼티가 아니며, 보이지 않는 개념적인 블록 내에 존재하게 된다.)
  • 전역 객체는 생성자 함수가 제공되지 않으며 개발자가 의도적으로 생성할 수 없다.
  • 브라우저 환경에서 여러 개의 script 태그를 통해 코드를 분리해도 하나의 전역 객체 window를 공유한다.

빌트인 전역 프로퍼티

빌트인 전역 프로퍼티는 전역 객체의 프로퍼티를 의미한다. 주로 애플리케이션 전역에서 사용하는 값을 제공한다.

  • Infinity
  • NaN
  • undefined

빌트인 전역 함수

빌트인 전역 함수는 애플리케이션 전역에서 호출할 수 있는 빌트인 함수로서 전역 객체의 매서드이다.

  • eval : 이 함수를 통해 실행되는 코드는 최적화가 수행되지 않으므로 사용 금지.
  • isFinite : 전달받은 인수가 유한수이면 true, 무한수이면 false를 반환. NaN은 false로 평가, null은 true로 평가된다.
  • isNaN : 전달받은 인수가 NaN이면 true, 아니면 false 반환
  • parseFloat : 전달받은 인수를 실수 숫자로 해석하여 반환
  • parseInt : 전달받은 인수를 정수 숫자로 해석하여 반환
  • encodeURI : 완전한 URI 주소를 문자열로 전달받아 이스케이프 처리를 위해 인코딩한다.
  • decodeURI : 인코딩된 URI를 인수로 전달받아 이스케이프 처리 이전으로 디코딩한다.

💡 이스케이프 처리란?
네트워크를 통해 정보를 공유할 때 어떤 시스템에서도 읽을 수 있는 아스키 문자 셋으로 변환하는 것이다.

  • encodeURIComponent : URI 구성 요소(component)를 전달받아 인코딩한다. encodeURIComponent는 쿼리 스트링 구분자(=, ?, &)까지 인코딩하는 반면, encodeURI는 쿼리 스트링 구분자는 인코딩하지 않는다.
  • decodeURIComponent : URI 구성 요소(component)를 전달받아 디코딩한다.
profile
| FE Developer | 기록의 힘 |

0개의 댓글