자바스크립트 객체 정의와 생성 방법, 프로퍼티

객체에 대해 설명해 봐야 한다면 뭐라고 해야 할까요?

 

객체란?

객체에 대한 짧은 정의는 이렇습니다

• 자바스크립트의 가장 기본적인 데이터 타입
  자바스크립트의 타입은 원시 타입과 객체 타입으로 나뉘어지죠
• 프로퍼티의 순서없는 집합
  const 객체 = { name: '김객체' , human: false }

객체는 자신만의 프로퍼티를 가지고, 프로토타입으로 불리는 다른 객체에서 프로퍼티를 상속받기도 합니다.
자바스크립트가 프로토타입 기반의 객체지향 프로그래밍 언어라고 불리우는 이유입니다.

 

프로퍼티

프로퍼티는 이름과 값으로 이루어져 있습니다.
이름은 문자열이나 심벌 타입을 가집니다. 보통 대부분의 이름은 문자열입니다.
값은 이름과 다르게 타입을 가리지 않습니다. 어떤 타입도 가능하고 getter나 setter 또는 둘다가 될 수도 있습니다.

 

프로퍼티는 자체 프로퍼티와 상속받은 프로퍼티가 있습니다.

 

자체 프로퍼티

객체에서 직접 정의한 멍멍이 객체에 age라는 자체 프로퍼티가 생겼습니다.
또한 멍멍이는 Object.prototype 이라는 객체 메서드를 상속합니다.

let 멍멍이 = {} 
멍멍이.age = 3

상속받은 프로퍼티

프로토타입 객체에서 상속한 뎅뎅이 객체는 멍멍이와 Object.prototype에서 프로퍼티를 상속합니다.

let 뎅뎅이 = Object.create(멍멍이)
뎅뎅이.age // 3

Object.create()는 객체를 생성하는 함수입니다.

 

객체 생성

객체를 생성하는 방법들이 있습니다. 

 

객체 리터럴

모두에게 익숙한 방법이네요.

객체 리터럴은 콜론으로 이름과 값을 구분하고, 이 쌍들을 콤마로 구분해 중괄호로 감싼 형태입니다.

let x = {} // 프로퍼티가 없는 개체
let abc = { a: 0, b: 1, c: 2 }

new 키워드

new 연산자는 객체를 생성하고 초기화합니다.

new 키워드 뒤에는 반드시 함수 호출이 있어야 합니다. 이런 함수를 생성자라고 부릅니다.

이 생성자는 새로 생성된 객체를 초기화합니다.
우리가 익히 알고 있는 자바스크립트에 내장된 생성자들이 있습니다.

let obj = new Object();
let arr = new Array();
let day = new Date();
let map = new Mpa();

Object.create() 함수

첫번째 인자를 프로토타입 삼아 새 객체를 생성합니다.

let xy = Object.create({x: 1, y: 2}) 
xy.x + xy.y //3

xy객체는 x와 y 프로퍼티를 상속합니다.

이 첫번째 인자에 null을 전달할 수도 있습니다. null을 프로토타입 삼는 것이 되는데
즉, 프로토타입이 없는 객체가 생성됩니다.
이렇게 생성된 객체는 아무것도 상속하지 않으며 기본 메서드조차 없는.. 정말 뭐가 없는 객체입니다.

let empty = {} 
let empty2 = new Object()

객체 리터럴과 new 연산자를 이용해 생성한 빈 객체입니다.
Object.create() 함수에서도 null 없이도 일반적인 빈 객체를 만들 수 있습니다.

let obj = Object.create(Object.prototype)

Object.prototype을 전달하여 일반적인 프로토타입을 가진 빈 객체가 생성됩니다.

 

요약

• 객체는 자바스크립트의 대표적인 타입이다.
• 프로퍼티를 가질 수 있고, 프로토타입이라는 객체로 인해 다른 객체를 상속받을 수 있다.