심층 자바스크립트(4) 객체 프로퍼티 읽기

객체를 만들었다면 사용을 할 수 있어야 한다. 게임으로 말하자면 객체는 보물상자다. 상자에서 무슨 보물을 선택하고 어떻게 사용할지는 유저(프로그래머)의 생각에 달려 있다.  객체(상자)에서 보물(프로퍼티, 메서드)을 확인하는 방법부터 알아보자.

1 프로퍼티 확인

아래와 같은 간단한 객체가 있다. 

---

let car  = { 

name : 'g80',

type : '승용',

cc : 3300,

maker : 'HYUNDAI'

}

---

위의 'car'객체의 속성(프로퍼티)개수와 각 속성값을 알아내려면 'in'과 'hasOwnProperty("속성")'을 사용하면 된다. in과 hasOwnProperty를 사용하면, 해당 속성이 있는지 없는지를 boolean값(true or false)으로 알려준다. 

---

console.log( 'name' in car );

//>> true

console.log( car.hasOwnProperty("maker") );

//>> true

---

2 프로퍼티 열거

객체에서 속성과 속성값을 세부적으로 알고 싶다면, for in문을 사용한다. for in문을 사용한다면, 임의로 만든 변수에 객체 속성값을 모두 담을 수 있다. 그리고 객체속성값을 배열식으로 나열할 수 있다. 

---

let car = {

       name : 'g80',

       maker : '현대',

       cc : 3300,

       color : 'white',

       sun_roof : yes

}   

let property;  // 속성을 담을 변수선언

for(property in car){

      console.log( property + ' = ' + car[property] );

}

//>> name = g80

//>> maker = 현대

//>> cc = 3300

//>> color = white

//>> sun_roof = yes

---

for in문을 사용하면 객체의 속성과 속성값을 모두 파악할 수 있다. 하지만 객체의 속성값이나 속성만 따로 뽑아낼 수는 없다. 객체의 속성이나 값만 추려내고 싶다면 Object.keys(객체명)를 사용한다. Object.keys()메서드를 사용하면, 속성과 속성값을 아래처럼 각각 뽑아낼 수 있다.

---

let gallaxy_s10 = {

    name : 'gallaxy_s10',

    memory : '6G',

    cpu : 'octa-core',

    modem : '5G'

} 

let keys = Object.keys(gallaxy_s10);

for(let i=0; i<keys.length; i++){

   console.log(keys[i])

}

//>>name

//>>memory

//>>cpu

//>>modem

for(let i=0; i<keys.length; i++){

   console.log(gallaxy[keys[i]])

}

//>> gallaxy_s10

//>>6G

//> octa-core

//> 5G

---