객체 [ Javascript ] [ JavaScript 문법 종합반 1주차 ]

2023. 6. 12. 18:00항해99/JavaScript 문법 종합반

// 객체
// key - value pair
// 하나의 변수에 여러개의 값을 넣을 수 있다

// 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("홍길동", 30, "남자");
let person2 = new Person("홍길순", 20, "여자");

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

// 3 객체 메소드 (객체가 가진 여러가지 기능 : Object.~~~)

// 3-1 Object.key() : key 를 가져오는 메소드
let keys = Object.keys(person);
console.log(keys); // [ 'name', 'age', 'gender' ]

// 3-2 values
let values = Object.values(person);
console.log(values); // [ '홍길동', 30, '남자' ]

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

// 3-4 assign
// 객체 복사
// let newPerson = {};
// Object.assign(newPerson, person);
// console.log(newPerson); // { name: '홍길동', age: 30, gender: '남자' }

let newPerson = {};
Object.assign(newPerson, person, { age: 29 });
console.log(newPerson); // { name: '홍길동', age: 29, gender: '남자' }

// 3-5 객체 비교
// 객체는 크기가 크다 -> 메모리에 저장할 때 별도의 공간에 저장
// person01 별도 공간에 대한 주소가 저장됨
let person01 = {
  name: "홍길동",
  age: 30,
  gender: "남자",
};

console.log(person === person01); // false

console.log(JSON.stringify(person) === JSON.stringify(person01)); // true

// 3-6 객체 병합
// ... : spread operator, 객체의 중괄호를 빼고 다 풀어서 써줘
let perfectMan = { ...person, ...person01 };
console.log(perfectMan); // { name: '홍길동', age: 30, gender: '남자' }