12. [JavaScript] 표준 내장 객체 - Object

🏃🏻‍♀️ 표준 내장 객체

[ Object, 객체 ]

🏰 const object;

const alien = {
    name: 'Poppy',
    age: 300,
    nationality: 'Space',
}

- Object.entries(Object);

배열안에 대상객체의 속성과 값을 자식 배열로 만들어 배열안에 배열이 아이템으로 있는 이중배열을 반환함

console.log(Object.entries(alien));
// (3)[Array(2), Array(2), Array(2)]
// 0: (2) ['name', 'Poppy']
// 1: (2) ['age', 300]
// 2: (2) ['nationality', 'Space']
// length: 3
// [[Prototype]]: Array(0)

// for of 반복문으로 배열데이터에 쉽게 접근
for (const [key, value] of Object.entries(alien)) {
    console.log(key, value);
};
// name Poppy
// age 300
// nationality Space

- Object.keys(Object);

대상객체의 속성(key, property)을 배열데이터로 반환

console.log(Object.keys(alien)); // (3) ['name', 'age', 'nationality']

- Object.values(Object);

대상객체의 속성의 값(values)을 배열데이터로 반환

console.log(Object.values(alien)); // (3) ['Poppy', 300, 'Space']

- Object.assign(targetObject, updateObject...);

• 한개 이상의 객체데이터가(updateObject) 대상객체를(targetObject) 인수로 들어온 객체데이터 순서대로 업데이트해(덮어씌움) 대상객체를 반환하고 대상객체의 원본데이터도 수정함
• 대상객체의 원본데이터가 수정되지 않으려면 수정대상이되는 첫번째 인수에 빈 객체데이터{} 를 넣음

const fruitPrice = { Apple: 1000, Peach: 2000 };
const price1 = { Peach: 3000, Strawberry: 1000 };
const price2 = { Strawberry: 1500, Apple: fruitPrice.Peach };
const finalPrice = Object.assign({}, fruitPrice, price1, Price2);

console.log(fruitPrice); // {Apple: 1000, Peach: 2000}
console.log(price1); // {Peach: 3000, Strawberry: 1000}
console.log(price2); //  {Strawberry: 1500, Apple: 2000}
console.log(finalPrice); // {Apple: 2000, Peach: 3000, Strawberry: 1500}

// 전개연산자로도 병합가능
const spreadFinalPrice = { ...fruitPrice, ...price1, ...price2 };

console.log(spreadFinalPrice); // {Apple: 2000, Peach: 3000, Strawberry: 1500}

 

🎮 패스트캠퍼스
프론트엔드 웹 개발의 모든 것 초격차패키지 Online.