이번에는 객체(Object)와 메서드(Method)에 대해서 배워보겠습니다~

객체(Object)

객체(Object)란 사물을 뜻하며 좁은 의미로는 let object = {num : 1}과 같은 객체를 의미합니다. 사물에 대한 정보들을 {}단위로 묶고 특정 로직들을 가지는 함수인 메서드와 멤버 변수를 가집니다.

객체는 변수에 저장할 수 있는데 아래의 객체를 object literal(객체 리터럴)이라고 합니다.
let heool = {};
객체는 순서가 없는 데이터의 모음이고, 순서가 있는 데이터의 모음은 배열입니다.

ex)
let arr = ['안녕', '안녕?', '안녕!', '난 댕댕이야'];

반면에, 객체는 키(key)-값(value) 쌍으로된 데이터의 모음으로써 순서가 뒤바껴도 전혀 상관이 없습니다. 배열은 index로 접근하지만 객체는 key로 접근하기 때문입니다.
key는 property name이라고도 하고, value는 property value라고도 합니다.

Key 특징

객체의 키에는 변수를 선언할 때 사용할 수 없었던 스페이스, 한글, 특수문자 등이 들어갈 수 있습니다. 키에 특수문자가 없으면 따옴표''를 생략하고 쓸 수 있습니다. 키에는 문자열, 숫자, 함수, 객체도 넣을 수 있습니다.

객체에 접근하는 방법

let difficult = {
  33: '숫자 형식도 되네',
  'my name': '스페이스 포함 가능',
  color: 'silver',
  키: '한글인 키는 따옴표가 없어도 되는군!!',
  '!키': '느낌표 있는 키는 따옴표가 필요하군',
  $special: '$는 없어도 되는군'
};

console.log(difficult.color);
console.log(difficult['color']);
숫자나 띄어쓰기가 된 키는 대괄호로 접근해야 합니다.
console.log(difficult['my name']);
console.log(difficult['33']);
변수명으로 접근하는 경우에도 대괄호로 접근해야 합니다.
let name = 'my name';
console.log(difficult[name]);

객체에는 접근하여 수정하거나 키와 값을 새로 생성하기에 편리합니다.
const로 선언된 변수에 객체를 할당하더라도 프로퍼티를 추가하거나 수정할 수 있습니다. 다만, const로 선언한 변수 자체에 객체를 재 할당하는 것은 불가능합니다.

Method(메서드)

메서드(Method)란 객체에 저장된 프로퍼티 값이 함수일 때를 말합니다.

console.log()
자바스크립트 어디에나 접근 가능한 console은 global 객체입니다. console다음에 dot(.)으로 프로퍼티에 접근했기 때문에 log라는 키의 값은 함수인 것 같습니다. 따라서 log는 console이라는 객체의 메서드입니다.

객체에서의 메서드 정의

let methodObj = {
  do: function() {
    console.log('메서드 정의는 이렇게');
  }
}
호출 방법은
methodObj.do();

객체의 특성

변수에 string 타입의 문자나 숫자 등은 그대로 저장된다. 하지만 변수에 객체를 저장한 것을 '객체 리터럴'이라고 하는데, 객체에는 키와 값이 그대로 저장되는 것이 아니라 메모리 주소(reference)를 할당해서 저장한다. 따라서 키와 값을 바꾸더라도 메모리 주소(reference)가 바뀌는 것이 아니라 그 안의 데이터만 바뀌게 된다.

사용 예시

const meat = {
	pig: '맛있다',
    cow: '더 맛있다'
}
//const로 선언한 변수(객체리터럴)도 수정 가능
meat.pig = '저온에 숙성하면 더 맛있어요'; 

Assignment
아래의 객체에서 '샐러드'라는 값이 출력 될 수 있도록 getAnswer함수에서 return 해 주세요.
let myProfile = {
name: '김개발',
address: {
email: '[email protected]',
home: '위워크'
},
'my favorite': {
food: [{
name: '샐러드',
price: 3500
}, {
name: '삼겹살',
price: 15000
}],
hobby: ['축구']
}
}

function getAnswer() {
	let getSalad = myProfile['my favorite'].food[0].name;
    return getSalad;
}