[JS] 객체 메소드, 객체 비교, 객체 병합

2023. 4. 4. 12:20개발/HTML+CSS+JS

더보기

 

  • 객체 메소드 (Object.~)
    • Object.keys()
    • Object.values()
    • Object.entries()
    • Object.assign()
  • 객체 비교
  • 객체 병합

객체 메소드 (Object.~)

Object.keys() 메소드 

Object.keys() 메소드는 객체의 속성 이름을 배열로 반환

let objWriter = {
    name: "김초엽",
    age: 31,
    gender: "여자",
    book: "우리가 빛의 속도로 갈 수 없다면"
};
console.log(Object.keys(objWriter))
console.log(Object.keys(objWriter).length)

 

Object.values() 메소드

Object.values() 메소드는 객체의 속성 값들을 배열로 반환

let objWriter = {
    name: "김초엽",
    age: 31,
    gender: "여자",
    book: "우리가 빛의 속도로 갈 수 없다면"
};
console.log(Object.values(objWriter))

 

Object.entries() 메소드

Object.entries() 메소드는 객체의 속성 이름과 속성 값들을 2차원 배열로 반환

let objWriter = {
    name: "김초엽",
    age: 31,
    gender: "여자",
    book: "우리가 빛의 속도로 갈 수 없다면"
};
console.log(Object.entries(objWriter))

 

Object.assign() 메소드

Object.assign() 메소드는 기존 객체를 복사하여 새로운 객체를 만듭니다.

let objWriter = {
    name: "김초엽",
    age: 31,
    gender: "여자",
    book: "우리가 빛의 속도로 갈 수 없다면"
};
let newObjWriter1 = Object.assign({}, objWriter);
let newObjWriter2 = Object.assign({}, objWriter, { book: "행성어 서점" });
console.log(objWriter);         // 원본 (source)
console.log(newObjWriter1);     // 복사 (source, target)
console.log(newObjWriter2);     // 복사하면서 내용 변경 (source1, source2, target)

 

-

 

객체 비교

객체를 비교할 때는 일반적으로 eq(===) 연산자를 사용할 수 없다.

대신 JSON.stringify() 함수를 사용, 객체를 문자열로 변환한 후, 문자열 비교를 할 수 있다.

let objWriter1 = {
    name: "김초엽",
    age: 31,
    gender: "여자"
};
let objWriter2 = {
    name: "김초엽",
    age: 31,
    gender: "여자"
};

console.log("1. '===' 연산자 비교 =>", objWriter1 === objWriter2);   // false
console.log("2. 문자열로 변환한 뒤 비교 =>", JSON.stringify(objWriter1) === JSON.stringify(objWriter2));   // true

 

-

 

 

객체 병합

전개 연산자(...)를 사용한 객체 병합.

let objWriter1 = {
    name: "김초엽",
    age: 31,
    gender: "여자"
};
let objWriter2 = {
    book: "우리가 빛의 속도로 갈 수 없다면",
};

// objWriter1을 풀고, objWriter2를 풀어서 다 줄줄줄 적어서 머지 객체 만들자!
let mergeObj = { ...objWriter1, ...objWriter2 };
console.log(mergeObj);