[JavaScript] object 메서드

📍 object

object 생성

cafe라는 객체를 만들어 음료별로 주문 수를 담아볼 것이다.

let cafe = {
    coffee: 2,
    latte: 3,
    tea: 5
}

console.log(cafe) // { coffee: 2, latte: 3, tea: 5 }

key와 value를 순서대로 입력해주면 된다.

속성 추가

cafe.juice = 7;
cafe['water'] = 1;

console.log(cafe) // { coffee: 2, latte: 3, tea: 5, juice: 7, water: 1 }

juice는 Dot Notation 표기법으로 추가한 것이며
water는 Bracket Notation 표기법으로 추가하였다.

모두 결과는 동일하다.

속성 삭제

delete cafe.juice;
delete cafe['water'];
    
console.log(cafe) // { coffee: 2, latte: 3, tea: 5 }

delete를 앞에 붙여주고 삭제할 속성을 입력한다. 방식은 위의 속성 추가와 마찬가지로 2가지 모두 가능하다.

📍 object method

let cafe = {
    coffee: 2,
    latte: 3,
    tea: 5
};

위에서 만들었던 cafe라는 객체를 기준으로 아래의 메서드를 살펴보겠다.

object.keys()

객체의 속성 이름을 순서대로 배열로 반환한다.

console.log(Object.keys(cafe)) // [ 'coffee', 'latte', 'tea' ]

object.values()

객체의 속성 값을 순서대로 배열로 반환한다.

console.log(Object.values(cafe)) // [ 2, 3, 5 ]

object.entries()

객체의 속성명과 속성 값을 함께 반환한다. [key, value] 쌍으로 반환되기 때문에 주로 반복문을 통해 사용한다.

for (let [key, value] of Object.entries(cafe)) {
  console.log(key, value);
}
/*
    coffee 2
    latte 3
    tea 5
*/

object.fromEntries()

키-값 쌍의 목록을 객체로 바꿔주는 기능이다.

let cafe = [['coffee', 2], ['latte', 3]];

let newCafe = Object.fromEntries(cafe);
console.log(newCafe); // { coffee: 2, latte: 3 }

object.hasOwnProperty()

객체가 특정 속성을 가지고 있는지 판단하여 true/false 불리언 값으로 반환한다.
위의 메서드들과 다른 점은, 메서드 앞에 Object를 붙이지 않고 실제 객체의 이름을 입력해야 한다. 또한 인자로는 찾는 속성 key명을 넣어주면 해당 프로퍼티가 있는지 확인한다.

let cafe = {
    coffee: 2,
    latte: 3,
    tea: 5
};

console.log(cafe.hasOwnProperty('latte')) // true

---

cf)
https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Object