자바스크립트 객체

자바스크립트 객체의 종류

 

1. 사용자 정의 객체

• 개발자가 직접 정의한 객체로 이름: 값 쌍으로 구성된 프로퍼티와 메서드를 가질 수 있습니다. 프로퍼티 이름은 문자열, 숫자, 심벌만 사용할 수 있으며 각 프로퍼티는 쉼표(,)로 구분합니다.

 

2. 내장 객체 (Built-in Object)

• 자바스크립트 언어에 미리 정의된 객체로 프로그램 개발 시 자주 사용하는 요소들을 포함합니다. 대표적인 예로 Number, Boolean, Date, Math, Array 등이 있습니다.

 

3. 문서 객체 모델 (DOM: Document Object Model)

• 웹 문서의 요소들은 메모리 상에 객체로 생성되어 있는데 이를 DOM이라 한다. 예를 들어 document 객체는 웹 문서 자체를 image 객체는 이미지 요소를 의미한다.

 

4. 브라우저 객체 모델 (BOM: Browser Object Model)

• 웹 브라우저에서 제공하는 객체로 브라우저의 정보를 담고 있는 navigator 객체, 현재 URL 정보를 담고있는 location 객체 등이 있다.

 

 

자바스크립트 객체 생성 방법

자바스크립트에서는 객체를 생성할 수 있는 3가지 주요 방법이 있습니다.

 

1. 객체 리터럴 표현식 (Literal Expression)

• 중괄호({})를 이용하여 프로퍼티와 메서드를 포함하는 객체를 바로 생성할 수 있습니다.

 

2. 생성자 함수 (Constructor Function)

• 동일한 종류의 객체를 여러 개 만들 때 사용합니다. 생성자 함수는 일반 함수와 동일한 형식을 사용하며 내부에서 this 키워드를 통해 생성된 객체를 참조합니다.

 

3. 클래스 (Class)

• ES6에서 도입된 클래스는 생성자 함수와 비슷하지만 더 직관적인 문법을 제공합니다. 동일한 종류의 객체를 여러 개 만들 때 사용됩니다.

 

 

객체 리터럴 표현식의 확장 기능

ES6 이후 객체 리터럴 표현식에는 다양한 유용한 기능이 추가되었습니다.

 

1. 단축 프로퍼티 (Shorthand Properties)

• 변수 이름과 프로퍼티 이름이 동일할 경우 간결하게 작성할 수 있습니다.

 

2. 계산된 프로퍼티 이름 (Computed Property Names)

• 프로퍼티 이름으로 변수를 사용할 수 있습니다.

 

3. 스프레드 연산자 (Spread Operator)

• 기존 객체의 프로퍼티를 분해하여 새 객체를 생성할 수 있습니다.

 

 

프로토타입과 상속

자바스크립트는 프로토타입 기반 상속을 제공합니다. 이를 통해 객체는 다른 객체의 프로퍼티와 메서드를 상속받을 수 있습니다.

 

1. 프로토타입 객체

• 생성자 함수를 정의하면 자바스크립트 엔진은 해당 함수의 프로토타입 객체를 자동으로 생성합니다.
  이 프로토타입 객체는 해당 생성자 함수로 생성된 모든 인스턴스에 공통으로 사용할 수 있는 프로퍼티와 메서드를 제공합니다.

 

2. 프로토타입 체인

• 자바스크립트의 모든 객체는 프로토타입 체인을 통해 상속받습니다.
  예를 들어 Object 프로토타입 객체는 모든 자바스크립트 객체의 최상위 객체입니다.

 

3. 상속을 통한 메서드 확장

• 생성자 함수나 클래스를 사용하여 객체를 생성한 후 프로토타입을 이용해 메서드를 추가할 수 있습니다.