[JS] Object 메서드 정리

은채·2022년 6월 5일
0

JavaScript

목록 보기
11/26
post-thumbnail

Object.keys() : 객체의 key만 담은 배열을 반환

주어진 객체의 속성 이름들을 일반적인 반복문과 동일한 순서로 순회되는 열거할 수 있는 배열로 반환
전달된 객체에서 직접 찾은 열거할 수 있는 속성 이름에 해당하는 문자열 배열을 반환
속성 이름의 순서는 객체의 속성을 수동으로 반복하여 지정하는 것과 동일

const pet = {
  name: '흰둥이',
  age: 8,
  owner: '짱구'
  isCat : false
};

console.log(Object.keys(pet));
// Array ["name", "age", "owner", "isCat"]

Object.values() : 객체의 value만 담은 배열을 반환

전달된 파라미터 객체가 가지는 (열거 가능한) 속성의 값들로 이루어진 배열을 리턴
이 배열은 for...in 구문과 동일한 순서를 가진다

const pet = {
 name : '흰둥이',
  age : 42,
  owner : '짱구', 
  isCat : false
};

console.log(Object.values(pet));
// Array ["흰둥이", 42, "짱구", false]

Object.entries() : [key, vlaue] 쌍을 담은 배열을 반환

for...in와 같은 순서로 주어진 객체 자체의 enumerable 속성 [키, 값] 쌍의 배열을 반환
Object.entries() 에 의해 반환된 배열(array)의 순서는 객체가 정의된 방법과 관련 없음
배열 순서가 쓸 곳이 있다면, 정렬을 먼저해야함

const pet = {
 name : '흰둥이',
 age: 8
}; 

console.log (Object.entries(pet))
// [ [ 'name', '흰둥이' ], [ 'age', 8 ] ]

for (const [key, value] of Object.entries(pet)) {
 console.log(`${key}: ${value}`);
}

// > "name: 흰둥이"
// > "age: 8"

Object.assign() :

출처 객체들의 모든 열거 가능한 자체 속성을 복사해 대상 객체에 붙여넣고 그 후 병합된 객체를 반환
반드시 target 객체를 정해야 함
target 객체의 속성 중 source 객체와 동일한 키를 갖는 속성의 경우, 그 속성 값은 source 객체의 속성 값으로 덮어씀
source 객체들의 속성 중에서도 키가 겹칠 경우 뒤쪽 객체의 속성 값이 앞쪽 객체의 속성 값보다 우선

const target = { name : '짱구', age : 8 };
const source = { pet: '흰둥이' , color : 'white' };

const returnedTarget = Object.assign(target, source);

console.log(target); 
// Object { name: "짱구", age: 8, pet: "흰둥이", color: "white" }
console.log(returnedTarget);
// Object { name: "짱구", age: 8, pet: "흰둥이", color: "white" }
profile
반반무마니

0개의 댓글