1-11 객체

1. 객체 생성 방법
1-1. 기본적인 객체 생성 방법
key-value pair
하나의 변수에 여러개의 값을 넣을 수 있다.
{}안의 value값에는 문자, 숫자, true/false, 함수 function () {}, 배열 [], 객체 {}. 즉 value의 형태는 제한이 없다.
let person = {
  name: "홍길동",
  age: 30,
  gender: "남자"
};

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

아직 this 키워드를 배우지 않은 상태이므로 이런 방법도 있다 정도로만 이해하기.

function Person(name, age, gender) {
  this.name = name;
  this.age = age;
  this.gender = gender;
}

let person1 = new Person("홍길동", 30, "남자");
let person2 = new Person("홍길순", 20, "여자");

2. 접근하는 방법(객체이름.키값)
console.log(person.name);
터미널 결과: 홍길동(기본적인 객체 생성 방법으로 생성한 person에 대한 키값으로 접근했더니 그에대한 value값을 도출한 것.

만약 console.log 했을때 추가로 
console.log("1", person.name); 한다면 아래의 결과가 나온다.
터미널 결과: 1 홍길동

3. 객체 메소드(객체가 가진 여러가지 기능: object.~~~)
3-1. object.keys() //key를 가져오는 메소드
let person = {
  name: "홍길동",
  age: 30,
  gender: "남자"
};

let keys = object.keys(person);
console.log("keys =>", keys);

왜 object가 정의되지 않았다고 나올까?

3-2. object.values() //value를 가져오는 메소드
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);

복사해올때 value값을 수정해서 가져오고싶을때
let newPerson = {};
object.assign(newPerson, person, {age : 31}) (어디에 복사할래, 뭘 복사할래, )
console.log("newPerson =>", newPerson);

3-5. 객체 비교
let person1 = {
  name: "홍길동",
  age: 30,
  gender: "남자"
};

let person2 = {
  name: "홍길동",
  age: 30,
  gender: "남자"
};

let str1 = "aaa";
let str2 = "aaa";
console.log("answer =>",person1 === person2);
console.log("answer =>",str1 === str2);

터미널 결과: aswer => false  answer => true
객체 person1과 person2는 같지 않다고 나오고 str1과 str2는 다르다고 나온다.
이유는 객체들(키-밸류)를 저장할때의 person1에 대한 주소를 가지고 person2도 객체를 저장할때의 주소를 가지고 있기 때문에, 주소가 다르기때문에 둘은 같지 않다고 인식하고,
반면에 str1과 str2는 직접 값을 저장하기 때문에 (aaa) 크기가 별로 크지 않기에 같은걸로 인식한다.

객체값이 같은 것을 같게 인식시키는 법
let person3 = {
  name: "홍길동",
  age: 30,
  gender: "남자"
};

let person4 = {
  name: "홍길동",
  age: 30,
  gender: "남자"
};

console.log(JSON.stringify(person3) === JSON.stirngify(person4)
터미널 결과: true
JSON.stringify의 문법을 활용하여 객체 내용을 말그대로 string화 시켜서 같은 문자로 인식시키는 방법.

3-6. 객체 병합
let person5 = {
  name: "홍길동",
  age: 30,
};

let person6 = {
  gender: "남자"
};

두 정보를 합치려면 중괄호 안의 내용을 다 풀어헤쳐야 한다.
... : spread operater
let perfectMan = { ...person5, ...person6 };
console.log(perfectMan);
터미널 결과: { name: '홍길동',  age: 30, gender: '남자' } 

 

 

배운점: JSON.stringify로 객체의 키밸류값을 그냥 문자열화 시킨다는것이 흥미로웠다. 

다만 JSON.stringify() 함수로 객체를 JSON 형태의 문자열로 변환할 때 undefined, Symbol, function은 변환되지 않고 무시된다고 한다(만약, undefined, Symbol, function이 배열 안에 있다면 이 값들은 null로 전환되어 표시).