객체(초반 정리)

객체라는 주제의 내용이 워낙 많기에 초반에 배우는 객체에 대한 정리이다

1. 객체 생성의 생성과 접근

// 1-1. 기본적인 객체 생성 방법(객체 리터널)
let person = {
    name: "홍길동",
    age : 30,
    gender : "남자"
};

// 1-2. 생성자 함수를 이용한 객체 생성 방법 
function Person(name, age, gender){
    this.name = name;
    this.age = age;
    this.gender = gender;
}

let person1 = new Person("이름", "나이", "성별");
let person2 = new Person("홍길순", 20, "여자");

// 2. 접근하는 방법
console.log(person.name); // 홍길동
console.log(person[age]); // 30

2.

// 3. 객체 메소드(객체가 가진 여러가지 기능 Object.~~)
// 3-1. Object.keys() : 객체의 key를 배열로 가져오는 메소드

let keys = Object.keys(person);
console.log(keys);

// 3-2. values : 객체의 values를 배열로 가져오는 메소드
let values = Object.values(person);
console.log(values);

// 3 - 3. entries
// key와 value를 묶어서 배열로 만든 배열(2차원 배열)
let entries = Object.entries(person);
console.log(entries)// [ [ 'name', '홍길동' ], [ 'age', 30 ], [ 'gender', '남자' ] ] 

// 3-4. assign(target, sources) 
// -> assign(어디에 복사할지, 뭘 복사할지)
// 객체 복사
let newPerson = {}; // 빈 객체
Object.assign(newPerson, person);
console.log(newPerson);// person 객체가 복사된다 
// -> { name: '홍길동', age: 30, gender: '남자' }

let newPerson2 = {};
Object.assign(newPerson2, person, { age : 31 });
console.log(newPerson2);// 같은 key가 있는 경우 values를 바꾼다 
// -> { name: '홍길동', age: 31, gender: '남자' }

let newPerson3 = {};
Object.assign(newPerson3, { age : 31 });
console.log(newPerson3);// { age : 31 }가 복사된다
// -> { age : 31 }

let newPerson4 = {};
Object.assign(newPerson4, person, { test : "결과확인" });
console.log(newPerson4);// person객체가 복사되고 { test : "결과확인" }도 복사된다
//-> { name: '홍길동', age: 30, gender: '남자', test: '결과확인' } 

let newPerson5 = {};
Object.assign(newPerson5, person, person2, person1, { test : "결과확인" });
console.log(newPerson5);// 가장 마지막에 있는 person1이 복사되고 { test : "결과확인" }도 복사된다
//-> { name: '이름', age: '나이', gender: '성별', test: '결과확인' } 

// 3-5. 객체 비교
// 객체는 크기가 상당히 커요 -> 메모리에 저장할 때 별도의 공간에 저장

// 객체의 데이터는 별도의 공간에 있다 
// person3는 별도 공간의 주소값을 가지고 있다(객체타입)
let person3 = {
    name: "홍길동",
    age : 30,
    gender : "남자"
};

//person4도 별도 공간의 주소값을 가지고 있다
// -> person3이 가리키는 공간의 주소와는 다른 주소
let person4 = {
    name: "홍길동",
    age : 30,
    gender : "남자"
};

let person3Address = person3 // 같은 주소 값을 가지게 된다

//직접 값을 저장(원시타입)
let str1 = "aaa" 
let str2 = "aaa"

let stringifyTest = JSON.stringify(person3)

console.log("answer1->", str1 === str2);
console.log("answer2->", person3 === person4);
console.log("answer3->", JSON.stringify(person3) === JSON.stringify(person4)); 
// JSON.stringify() : 문자열화 시킨다  
// -> JSON.stringify(person3) 주소값으로 되어 있던 거를 문자열화 시킨다
console.log(stringifyTest);
console.log(typeof stringifyTest); //string

Object.assign(person3Address, { age : 31 });
console.log(person3.age); // person3Address와 같은 주소값을 가지기에 동일한 영향을 받는다

// 3-6. 객체 병합

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

// ... : spread operator
// es6에서 추가된 명령어
// {}중괄호를 풀어서 나열한다
let perfectMan = {...person5, ...person6};
console.log(perfectMan) // { name: '홍길동', age: 30, gender: '남자' }

let spreadTest1 = {person5}
let spreadTest2 = {...person5}
console.log(spreadTest1) // { person5: { name: '홍길동', age: 30 } } 
console.log(spreadTest2) //{ name: '홍길동', age: 30 }