프론트엔드 짧은 간단 지식 정리 - 네이티브 객체와 호스트 객체

자바스크립트에서 네이티브 객체와 호스트 객체는 자바스크립트 환경에서 객체가 어디에서 기원했는지에 따라 구분되는 두 가지 객체 유형이다.

1. 네이티브 객체(Native Object)

• 네이티브 객체는 자바스크립트 언어 자체에서 제공하는 객체들이다.
• ECMAScript 사양에 정의되어 있으며, 특정 환경이나 플랫폼과 상관없이 모든 자바스크립트 환경에서 동일하게 사용할 수 있다. (기본적인 자바스크립트 기능을 구현하는데 필요한 객체들이다.)
  • 네이티브 객체를 Global Objects라고 부르기도 하는데 이것은 전역 객체(Global Object)와 다른 의미로 사용되므로 혼동에 주의하여야 한다.
  • 전역 객체(Global Object) 는 모든 객체의 최상위 객체를 의미하며 일반적으로 Browser-side에서는 window, Server-side(Node.js)에서는 global 객체를 의미한다.

주요 네이티브 객체 예시

• Object: 모든 객체의 상위 객체로, 자바스크립트에서 모든 객체는 Object를 상속받는다.
• Array: 배열을 다루는 객체로, 배열의 길이를 확인하거나 항목을 추가/삭제하는 기능을 제공한다.
• String: 문자열을 다루는 객체로, 문자열의 길이를 확인하거나 문자열 조작 기능을 제공한다.
• Number: 숫자를 다루는 객체로, 숫자 연산 및 기타 숫자 관련 기능을 제공한다.
• Boolean: 불리언 값을 다루는 객체로, 참(true) 또는 거짓(false)의 논리값을 처리한다.
• Date: 날짜와 시간을 다루는 객체로, 현재 시간, 과거/미래 날짜 등을 다룰 수 있다.
• RegExp: 정규 표현식을 다루는 객체로, 문자열에서 패턴 매칭 작업을 처리할 수 있다.
• Promise: 비동기 작업을 다루는 객체로, 작업이 완료되었을 때 결과를 처리할 수 있도록 도와준다.
• Math: 자바스크립트에서 수학 관련 기능을 제공하는 네이티브 객체로, 생성자 함수가 아닌 정적 메서드와 속성들만 가지고 있다. 수학적 계산, 상수, 함수 등을 활용할 수 있다.
• Error: 자바스크립트에서 오류를 처리하고 디버깅할 수 있게 도와주는 객체로, 코드 실행 중에 발생한 오류를 나타낸다. Error 객체는 일반 오류뿐만 아니라 특정 유형의 오류를 나타내는 여러 서브클래스(TypeError, ReferenceError, SyntaxError, RangeError, EvalError 등)도 포함하고 있다.
• Map: 키-값 쌍을 저장하고, 각 쌍의 삽입 순서를 기억하는 자바스크립트 네이티브 객체이다. 객체와 달리 Map은 키로 모든 데이터 유형을 허용하며, iterable로 순회할 수 있습니다.
• Set: 값의 컬렉션을 저장하는 네이티브 객체로, 각 값은 한 번만 저장될 수 있다.(중복된 값이 허용되지 않음). Set은 iterable로 순회가 가능하며, 삽입 순서를 유지한다.

2. 호스트 객체(Host Object)

• 호스트 객체는 자바스크립트가 실행되는 런타임 환경(브라우저, Node.js 등)에서 제공하는 객체들다.
  • 즉, 자바스크립트 언어 자체에서 제공되는 것이 아니라, 실행되는 플랫폼에 따라 달라질 수 있는 객체들을 의미한다.
  • 브라우저에서는 브라우저 관련 기능을 제공하고, Node.js에서는 서버 관련 기능을 제공하는 등, 각 환경에 맞춘 기능들을 담당한다.

주요 호스트 객체 예시 (브라우저 환경)

• window: 브라우저의 전역 객체로, 현재 웹 페이지의 창(window)을 나타낸다.
• document: 현재 웹 페이지의 DOM(Document Object Model)을 나타내는 객체로, HTML 문서를 조작할 수 있다.
• navigator: 브라우저 정보를 제공하는 객체로, 브라우저의 이름, 버전, 사용자 에이전트 등을 확인할 수 있다.
• XMLHttpRequest: 서버와 비동기적으로 데이터를 주고받을 수 있게 해주는 객체로, AJAX 요청을 처리할 때 사용된다.
• localStorage / sessionStorage: 웹 브라우저에 데이터를 로컬에 저장할 수 있는 객체들이다.

주요 호스트 객체 예시 (Node.js 환경)

• process: 현재 실행 중인 Node.js 프로세스에 대한 정보를 제공하는 객체로, 환경 변수에 접근하거나 프로세스를 종료하는 등의 작업을 할 수 있다.
• fs: 파일 시스템과 상호작용할 수 있는 객체로, 파일을 읽고 쓰는 등의 작업을 할 수 있다.
• http: HTTP 서버나 클라이언트를 만들 수 있는 객체로, 네트워크 요청을 처리할 수 있다.

3. 주요 차이점 정리

• 네이티브 객체 : 자바스크립트 표준에서 정의된 객체들로, 모든 자바스크립트 환경에서 사용할 수 있다.
• 호스트 객체 : 자바스크립트가 실행되는 환경에서 제공하는 객체들로, 브라우저, Node.js 등의 특정 플랫폼에서만 사용할 수 있다.