자바스크립트 객체

객체 선언하는 법

key - value fair

key에는 어떤 타입도 사용 가능하다.

1. 객체 생성 방법

1-1. 가장 기본적인 객체 생성 방법

 

let person = {

name : "문현후",

age : 25,

gender : "남자"

};

 

이런 식으로 작성한다.

 

1-2. 생성자 함수를 이용한 객체 생성 방법

 

function Person(name, age, gender) {

this.name = name;

this.age = age;

this.gender = gender;

}

let person1 = new Person{"문현후", 25, "남자"};

let person2 = new Person{"문현순", 21, "여자"};

 

이런 식으로 작성 가능하다.

 

2. 접근하는 방법

예시

 

console.log(person.name);

console.log(person.age);

console.log(person.gender);

 

선언한 변수뒤에 .붙이고 필요한 해당 키를 입력하면 그 키에만 접근 가능하다.

 

3. 객체 메서드

객체 메서드란 객체가 가진 여러 가지 기능이라고 생각하면 된다.

 

3-1. Object.key()

 

key를 가져오는 메서드

예시

 

let person = {

name : "문현후",

age : 25,

gender : "남자"

};

 

let keys = Object.keys(person);

console.log("keys => ", keys);

 

이렇게 작성하면 배열형태로 key들이 출력된다.

 

3-2. values

 

예시

 

let values = Object.values(person);

console.log("values => ", values);

 

3-3 entries

 

key와 value를 묶어서 만든 2차원 배열

예시

 

let entries = Object.entries(person);

console.log("entries => ", entries);

 

3-4. assign

 

객체 복사

예시

 

let newPerson = {};

Object.assign(newPerson, person);

console.log("newPerson => ", newPerson);

 

설명을 읽으면 첫 번째 매개변수는 어디에 복사할래, 두 번째는 뭘 복사할래 이 의미이다.

 

key 값을 변경하고 싶다면

예시

 

let newPerson = {};

Object.assign(newPerson, person, {age: 27});

console.log("newPerson => ", newPerson);

 

이런 식으로 세 번째 매개변수값에 변경할 키값을 중괄호로 넣어주면 된다.

 

3-5. 객체 비교

 

예시

 

let person1 = {

name : "문현후",

age : 25,

gender : "남자"

};

let person2 = {

name : "문현후",

age : 25,

gender : "남자"

};

console.log("answer => ", person1 == person2);

 

이런 식으로 같냐고 물어보는 코드를 짜면

출력값은 false로 나온다.

똑같이 문자열로

 

let str1 = "aaa";

let str2 = "aaa";

console.log("answer => ", str1 == str2);

 

이렇게 작성하면 이번엔 true가 나온다.

문자열은 같으면 true반환이지만 

왜 객체는 같은데 false로 반환할까?

 

간략하게 얘기하자면 객체는 객체자체가 크기가 크다

그래서 메모리에 저장할 때 별도의 공간에 저장을 하는데

person1 객체 저장소의 주소와 person2 주소가

서로 다르기 때문에 false를 출력한다.

이 내용은 나중에 더 자세히 알아보겠다.

 

하지만 간단하게 true로 반환하는 방법이 있는데

 

console.log(JSON.stringify);

 

를 사용하면 객체 주소를 문자열화 해주기 때문에

아까 문자열 비교는 true로 반환하듯이

객체도 문자열화했기 때문에 true로 반환해 준다.

 

console.log(JSON.stringify(person1) === JSON.stringify(person2));

 

3-6. 객체 병합

 

예시

 

let person1 = {

name : "문현후",

age : 25,

};

let person2 = {

gender : "남자"

};

 

이 두 개의 객체를 합쳐야 한다면

 

... : spread operator를 사용한다.

 

let perfectMan = {...person1, ...person2};

console.log(perfectMan);

 

이렇게 작성하면 둘이 합쳐진 perfectMan객체로 병합된다.