티스토리 뷰
목차
아래와 같은 JavaScript 배열을 객체로 변환하고자 합니다.
['a','b','c']
위 배열을
{
0: 'a',
1: 'b',
2: 'c'
}
이런 오브젝트로 변환하는데 몇 가지 방법이 있습니다. 자바스크립트 2가지 방법 + jQuery 1가지 방법, 총 3가지 소개합니다.
1. ECMAScript 6 : Object.assign
Object.assign() 함수는 열거 가능한 값을 하나씩 대상 오브젝트로 복사할 때 사용합니다.
Object.assign({}, ['a','b','c']); // {0:"a", 1:"b", 2:"c"}
length 배열은 열거할 수 없어서 복사되지 않습니다.
ES6 스프레드 사용하여 같은 결과를 얻을 수도 있습니다.
{ ...['a', 'b', 'c'] }
2. 중간에 변경할 값이 있다면
function toObject(arr) {
var rv = {};
for (var i = 0; i < arr.length; ++i)
rv[i] = arr[i];
return rv;
}
위 함수를 이용해 배열의 특정 위치 값만 변경하여 오브젝트로 복사할 수 있습니다.
또한, 중간에 비어있는 값을 제어할 수도 있습니다.
function toObject(arr) {
var rv = {};
for (var i = 0; i < arr.length; ++i)
if (arr[i] !== undefined) rv[i] = arr[i];
return rv;
}
undefined 속성을 알아내어 보다 꼼꼼하게 복사할 수 있죠.
최신 자바스크립트 런타임에서는 다음과 같이 .reduce()를 응용해도 됩니다.
var obj = arr.reduce(function(acc, cur, i) {
acc[i] = cur;
return acc;
}, {});
결과는 2번째 JavaScript 소스와 동일합니다.
3. jQuery를 사용한다면
$.extend({}, ['a', 'b', 'c']);
간단하게 extend를 이용하면 됩니다.
관련 글
javascript 형태: date format을 JSON 포맷으로