객체의 반복문

object loop 😳

객체에서는 크게 두가지의 방법으로 객체의 반복문 작성이 가능하다.

1. Object.keys,values,entries

  • Object.keys(obj): 객체가 가지고 있는 키들의 목록을 배열로 리턴하는 메서드.
  • Object.values(obj): 객체가 가지고 있는 값들의 목록을 배열로 리턴하는 메서드.
  • Object.entries(obj): 객체가 가지고 있는 프로퍼티([키:값])들의 목록을 배열로 리턴하는 메서드.

Object.keys()를 이용한 반복문

const obj = {
  name: 'melon',
  weight: 4350,
  price: 16500,
  isFresh: true
}

const keys = Object.keys(obj) // ['name', 'weight', 'price', 'isFresh']

for (let i = 0; i < keys.length; i++) {
  const key = keys[i] // 각각의 키
  const value = obj[key] // 각각의 키에 해당하는 각각의 값

  console.log(value)
}

위 for문 안의 변수 지정시에는 마침표 표기법 대신 대괄호 표기법을 사용해야 한다.

2. for-in (es6)

기존 for문을 더욱 간단하게 축약한 문법이다.
for-in 문은 인덱스의 값으로 무엇을 할당하고, 반복문이 몇번 돌아야 할 지를 자바스크립트 엔진 내부에서 자동으로 결정하게 된다.

// 배열에 사용
const arr = ['coconut', 'banana', 'pepper', 'coriander']
for (let i in arr) {
  console.log(i)
  console.log(arr[i])
}

// 객체에 사용
let user = {
  name: "John",
  age: 30,
  isAdmin: true
};

for (let key in user) {
  // keys
  alert( key );  // name, age, isAdmin
  // values for the keys
  alert( user[key] ); // John, 30, true
}

이렇게 객체를 가지고 for-in 문을 사용하면, for-in 문의 인덱스에 해당하는 변수가 숫자가 아닌 객체의 각각의 키에 해당하는 문자열을 할당받게 된다.

좋은 웹페이지 즐겨찾기