[JavaScript 문법] 객체

조아영·2024년 7월 22일

📌

key : value pair
하나의 변수에 여러개의 값을 넣을 수 있습니다.

◼ 생성 방법

1. 기본 객체 생성 방법

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

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, "여자");

◼ 접근 방법

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

console.log(person.name); // 홍길동
console.log(person.age); // 30
console.log(person.gender); // 남자

◼ 객체 비교

객체의 크기는 매우 커서 메모리에 저장 시 별도의 공간에 저장합니다.
따라서 두 객체는 같지 않습니다.

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

console.log(person1 === person2); // false
// person1 별도 공간에 대한 주소 !== person2 별도 공간에 대한 주소

JSON.stringify : JSON에서 제공하는 문자열화 시키는 기능.
객체 비교시 JSON.stringify를 이용합니다.

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

◼ 객체 병합

객체 병합을 할 때는 전개 연산자(...)를 사용합니다.

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

// ... : 스프레드 연산자(spread operator), {}를 풀어서 넣는다.
let perfectMan = { ...person1, ...person2 };
console.log(perfectMan); // { name: "홍길동", age: 30, gender: "남자" }

◼ 객체 메서드

Object.keys()

객체의 열거 가능한 속성 이름(key)들을 배열로 반환합니다.

let keys = Object.keys(person);
console.log(keys); // [ "name", "age", "gender" ]

Object.values()

객체의 열거 가능한 속성 값(value)들을 배열로 반환합니다.

let keys = Object.values(person);
console.log(keys); // [ "홍길동", 30, "남자" ]

Object.entries()

객체의 열거 가능한 속성 [key, value] 쌍을 배열로 반환합니다.(2차원 배열)

let person = {
    name: "홍길동",
    age: 30,
    gender: "남자",
};
let entries = Object.entries(person);

console.log(entries); // [ [ "name", "홍길동" ], [ "age", 30 ], [ "gender", "남자" ] ]

Object.assign()

Object.assign(복사할 위치, 복사할 것, { 변경해서 복사할 정보 });
하나 이상의 출처 객체(source object)로부터 대상 객체(target object)에 속성을 복사합니다.

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

Object.assign(newPerson, person);
console.log(newPerson); // { name: "홍길동", age: 30, gender: "남자" }

Object.assign(newPerson, person, { gender: "여자" });
console.log(newPerson); // { name: "홍길동", age: 30, gender: "여자" }

Object.freeze()

객체를 동결(freeze)하여 더 이상 수정할 수 없게 만듭니다.

let person = { name: "홍길동", age: 30 };
Object.freeze(person);
person.age = 31; // 무시됨
console.log(person.age); // 30

Object.seal()

객체를 밀봉(seal)하여 새로운 속성을 추가하거나 기존 속성을 삭제할 수 없게 하지만, 속성의 값은 변경할 수 있습니다.

let person = { name: "홍길동", age: 30 };
Object.seal(person);
person.age = 31; // 변경 가능
person.city = "서울"; // 추가 불가
delete person.name; // 삭제 불가
console.log(person); // { name: "홍길동", age: 31 }

0개의 댓글