JavaScript 객체(Object)

JavaScript에서 객체는 Key Value pair로 존재합니다.
객체는 하나의 변수에 여러개의 값을 넣을 수 있다는 장점이 있습니다.

객체를 생성하는 방법은

let obj = {
  key : value,
  key1 : value1,
  key2 : value2
}; 

이런식으로 변수를 선언해주고 중괄호 안에 key : value를 넣어주면 됩니다.

객체의 Key와 value가 될 수 있는 데이터 타입은 무엇이 있을까요?

Key가 될 수 있는 데이터 타입에는 문자열(string), 숫자(number), 심볼(symbol)이 있습니다.

Key에 숫자를 입력할 수는 있지만 자동으로 문자열(string)으로 변환이 됩니다.

Key의 값들은 객체 내에서 고유해야 합니다. 만약 Key가 다음과 같이 중복이 된다면

let obj={
	name : "민석"
  	name : "철수"
  	age : 26
}

//{ name: '철수', age: 26 }

위와 같이 마지막 value가 Key에 대한 value가 됩니다.

Value에는 Key보다 될 수 있는 데이터 타입들이 다양합니다.

Value가 될 수 있는 것들에는 문자열(string), 숫자(number), 심볼(symbol), boolean, 함수(function), 배열(array), 다른객체(object), 함수(function), undefined, null이 있습니다.

다음은 객체의 메소드들에 대해서 알아보겠습니다.

1. key들을 불러오는 메소드

let obj = {
  name : "민석",
  age : 26
}

이런 객체가 있을 때 key값만 불러오고 싶을 땐 Object.keys(객체명)을 해주면 됩니다.

console.log(Object.keys(obj))// ['name', 'age']

key값들로 이루어진 배열을 얻을 수 있습니다.

2. value들을 불러오는 메소드

value값들을 불러오고 싶을 땐 Object.values(객체명)

console.log(Object.values(obj))// ['민석', 26]

value값으로 이루어진 배열을 얻을 수 있습니다.

3. key와 value를 묶어서 배열로 만든 배열

Object.entries(객체명)을 입력하게 되면 key와 value를 묶여서 만든 배열끼리 만든 배열을 볼 수 있습니다.

console.log(Object.entries(obj))//[ [ 'name', '민석' ], [ 'age', 26 ] ]

4. 객체를 복사해서 새로운 객체 만들기
   Object.assign(붙여 넣을 객체명, 복사할 객체명}을 입력하게 되면 새로운 객체에 기존의 객체의 key value들을 복사해옵니다.

let newobj = {};
Object.assign(newobj,obj)
console.log(newobj) //{name : "민석", age : 26}

위와 같은 결과를 얻을 수 있습니다.

5. 객체를 병합하기

let obj1 = {
  name : "민석",
  age : 26
}
let obj2 = {
  gender = "남성"
}

이러한 두 객체가 있습니다. 이 두 객체의 key value를 병합하여 새로운 객체를 생성하는 방법은

let obj3 ={...obj1, ...obj2}
console.log(obj3) // {name : '민석', age : 26, gender : '남성'}

객체명 앞에 ... 을 붙혀서 객체를 병합합니다. 만약 병합하는 두 객체에 같은 key가 있다면 뒤에 있는 객체의 value로 병합이 됩니다.

let obj1 = {
  name : "민석",
  age : 26
}
let obj2 = {
  name : "철수",
  gender = "남성"
}
let obj3 ={...obj1, ...obj2}
console.log(obj3) // {name : '철수', age : 26, gender : '남성'}

7. 객체 비교

let obj1 = {
  name : "민석",
  age : 26
}
let obj2 ={
  name : "민석",
  age : 26
}

여기 객체명은 다르고 key와 value가 같은 두 객체가 있습니다. 컴퓨터는 이 두 객체가 같다고 할까요?

console.log(obj1 === obj2) //false

false가 반환됩니다...

왜 두 객체는 다르다고 할까요?

그 이유는 저장하는 메모리 주소가 다르기 때문입니다. 객체는 크기가 크기 때문에 다른 메모리 주소에 각각 저장이 되는데 컴퓨터는 두 객체의 주소가 다르기 때문에 false를 반환하는 것입니다.

그렇다면 두 객체의 key와 value만 비교하는 방법은?

JSON.stringify(객체명)을 입력해 주게 된다면 객체내의 key value를 문자열로 변환해 주기 때문에 비교가 가능합니다.

console.log(JSON.stringify(obj1) === JSON.stringify(obj2))// True