Object(객체) - 1

Object

객체: key와 value로 이뤄진 property들을 담을 수 있는 자료형

Method

메소드: 객체의 property 중 자료형이 함수인 property

객체 생성

객체를 생성하는 방법은 다음과 같다.

1. let 객체이름 = new Object();

2. let 객체이름 = {};

1. let 객체이름 = {};

중괄호{} 안에 property를 넣어준다.
property는 콜론(:)을 기준으로 좌측에 key, 우측에 value가 들어간다.

let 객체이름 = {
	key: "value",
	key: "value"
};

마치 key와 value의 쌍들로 배열 만드는 모양새인데, 만약 객체에 메소드를 추가하고 싶다면 어떨까?

다음은 배열로 객체를 만든 예시이다.

let snack = [
	{ name: '꼬깔콘',
   	  price: 1200 },
  	{ name: '새우깡',
    	  price: 1200 },
  	{ name: '고래밥',
    	  price: 1000 }
   	];

이 객체에 1번의 방법으로 메소드를 추가하면 어떨까?

let snack = [
	{ name: '꼬깔콘',
   	  price: 1200,
      	  print: function(){
          console.log(`${this.name}의 가격은 ${this.price}이다.`}
          },
  	{ name: '새우깡',
   	  price: 1200,
      	  print: function(){
          console.log(`${this.name}의 가격은 ${this.price}이다.`}
          },
        { name: '고래밥',
   	  price: 1000,
      	  print: function(){
          console.log(`${this.name}의 가격은 ${this.price}이다.`}
          }
   	];

this: 객체에 있는 속성을 메소드에서 사용할 경우, 자신이 갖고 있는 속성임을 분명히 표시해야 한다. 이때 사용하는 키워드가 this이다.

??? 이렇게 만들 바에 함수를 빼는 게 낫지 않나???
함수를 외부로 빼온 예시이다.

let snack = [
	{name: '꼬깔콘', price: 1200},
   	{name: '새우깡' ,price: 1200},
    	{name: '고래밥', price: 1000}
];

function printSnack(snack){
	console.log(`${snack.name}의 가격은 ${snack.price}이다.`);
}

그러나 여긴 한 가지 문제가 있다. 자바스크립트는 객체 지향 프로그래밍 언어기 때문에 snack.print() 형태로 코드를 작성해야 한다. print()메소드는 snack 객체의 '기능'이기 때문이다. 그래서 자바스크립트는 '생성자 함수'와 '프로토타입'이 있다.

생성자 함수에 관한 내용은 object-2 게시글에 추가하기로 한다.