본문 바로가기
자바스크립트 Deep Dive

[Javascript] 객체 프로퍼티 (key, value) 동적으로 생성 및 조회하기

by 준생님 2023. 2. 9.

실무를 하다보면 객체의 key value값을 동적으로 할당해야 할 때가 많다.

이럴경우 객체 표현식중 대괄호를 사용하여 쉽게 생성할 수 있다.

var prefix = 'prefix';
var i = 0;
var obj = {};
for (i; i < 3; i++) {
    obj[prefix + '-' + i] = i;
}
console.log(obj); // { 'prefix-0': 0, 'prefix-1': 1, 'prefix-2': 2 }

 

이렇게 생성된 obj 객체를 조회하는 방법은 다음과 같다.

방법1. for..in 문법 이용

for (var key in obj) {
    console.log(key + ":::" + obj[key]);
}

 

방법2. Object.keys 함수를 이용

var objKeyArr = Object.keys(obj);
console.log(objKeyArr); // [ 'prefix-0', 'prefix-1', 'prefix-2' ]
for (i = 0; i < objKeyArr.length; i++) {
    console.log(objKeyArr[i] + ":::" + obj[objKeyArr[i]]);
}

둘다 결과값은 동일하다.

prefix-0:::0
prefix-1:::1
prefix-2:::2