development

배열을 객체로 변환

big-blog 2020. 2. 19. 22:06
반응형

배열을 객체로 변환


변환하는 가장 좋은 방법은 무엇입니까?

['a','b','c']

에:

{
  0: 'a',
  1: 'b',
  2: 'c'
}

ECMAScript 6은 쉽게 폴리 필 가능합니다 Object.assign:

Object.assign()메소드는 열거 가능한 모든 고유 특성의 값을 하나 이상의 소스 오브젝트에서 대상 오브젝트로 복사하는 데 사용됩니다. 대상 객체를 반환합니다.

Object.assign({}, ['a','b','c']); // {0:"a", 1:"b", 2:"c"}

length배열 의 자체 속성은 열거 할 수 없으므로 복사되지 않습니다.

또한 ES6 스프레드 구문사용 하여 동일한 결과를 얻을 수 있습니다.

{ ...['a', 'b', 'c'] }

이 같은 기능으로 :

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;
}

최신 JavaScript 런타임에서는 다음 .reduce()방법을 사용할 수 있습니다 .

var obj = arr.reduce(function(acc, cur, i) {
  acc[i] = cur;
  return acc;
}, {});

그것은 또한 배열에서 "구멍"을 피 .reduce()합니다. 그것이 작동 하는 방식 이기 때문입니다 .


어큐뮬레이터 일명 사용할 수 있습니다 reduce.

['a','b','c'].reduce(function(result, item, index, array) {
  result[index] = item; //a, b, c
  return result;
}, {}) //watch out the empty {}, which is passed as "result"

빈 개체 {}를 시작점으로 전달하십시오. 그런 다음 해당 개체를 증분 "증가"합니다. 반복이의 말에 result있을 것입니다{"0": "a", "1": "b", "2": "c"}

배열이 키-값 쌍 객체 세트 인 경우 :

[{ a: 1},{ b: 2},{ c: 3}].reduce(function(result, item) {
  var key = Object.keys(item)[0]; //first property: a, b, c
  result[key] = item[key];
  return result;
}, {});

생산할 것이다 : {a: 1, b: 2, c: 3}

완전성을 위해 reduceRight배열을 역순으로 반복 할 수 있습니다.

[{ a: 1},{ b: 2},{ c: 3}].reduceRight(/* same implementation as above */)

생산할 것이다 : {c:3, b:2, a:1}

어큐뮬레이터는 특정 목적을 위해 모든 유형이 될 수 있습니다. 예를 들어 배열에서 객체의 키와 값을 바꾸려면 []다음을 전달하십시오 .

[{ a: 1},{ b: 2},{ c: 3}].reduce(function(result, item, index) {
  var key = Object.keys(item)[0]; //first property: a, b, c
  var value = item[key];
  var obj = {};
  obj[value] = key;
  result.push(obj);
  return result;
}, []); //an empty array

생산할 것이다 : [{1: "a"}, {2: "b"}, {3: "c"}]

달리 map, reduce1-1 매핑으로 사용할 수 없습니다. 포함 또는 제외하려는 항목을 완전히 제어 할 수 있습니다. 따라서 reduce당신이 무엇을 달성 할 수 filter있게하는 않는 reduce매우 다양한 :

[{ a: 1},{ b: 2},{ c: 3}].reduce(function(result, item, index) {
  if(index !== 0) { //skip the first item
    result.push(item);
  }
  return result;
}, []); //an empty array

생산할 것이다 : [{2: "b"}, {3: "c"}]

주의 : reduceObject.key일부입니다 ECMA 5th edition; 지원하지 않는 브라우저 (특히 IE8)에 대한 폴리 필을 제공해야합니다.

Mozilla 의 기본 구현을 참조하십시오 .


jquery를 사용하는 경우 :

$.extend({}, ['a', 'b', 'c']);

완전성을 위해 ECMAScript 2015 (ES6) 확산. 트랜스 파일러 (Babel) 또는 ES6 이상을 실행하는 환경이 필요합니다.

console.log(
   { ...['a', 'b', 'c'] }
)


아마 이런 식으로 쓸 것입니다 (매우 드물게 underscorejs 라이브러리가 없기 때문에).

var _ = require('underscore');

var a = [ 'a', 'b', 'c' ];
var obj = _.extend({}, a);
console.log(obj);
// prints { '0': 'a', '1': 'b', '2': 'c' }

여기 완전성을위한 O (1) ES2015 방법이 있습니다.

var arr = [1, 2, 3, 4, 5]; // array, already an object
Object.setPrototypeOf(arr, Object.prototype); // now no longer an array, still an object

보지 못했다-

Object.assign({}, your_array)

Array를 Object로 변환하는 데 사용 Object.assign하고 array.reduce기능 할 수 있습니다 .

var arr = [{a:{b:1}},{c:{d:2}}] 
var newObj = arr.reduce((a, b) => Object.assign(a, b), {})

console.log(newObj)


Object.assign({}, ['one', 'two']); // {0: 'one', 1: 'two'}

현대 JavaScript에서 쉬운 방법은 Object.assign()키 : 값을 한 객체에서 다른 객체로 복사하는 것 외에는 아무것도하지 않는 것입니다. 이 경우 Array속성을 new에 기부합니다 {}.


ECMAScript 2015 (ES6) 표준의 일부이기 때문에 객체 확산 연산자를 사용했습니다.

const array = ['a', 'b', 'c'];
console.log({...array});
// it outputs {0:'a', 1:'b', 2:'c'}

다음과 같은 바이올린 을 예로 들었습니다 .


5 년 후, 좋은 방법이 있습니다 :)

Object.assign ECMAScript 2015에 도입되었습니다.

Object.assign({}, ['a', 'b', 'c'])
// {'0':'a', '1':'b', '2':'c'}

스프레드 연산자를 사용할 수 있습니다

x = [1,2,3,10]
{...x} // {0:1, 1:2, 2:3, 3:10}

ES6을 사용하는 경우 Object.assign 및 스프레드 연산자를 사용할 수 있습니다

{ ...['a', 'b', 'c'] }

다음과 같이 중첩 배열이있는 경우

var arr=[[1,2,3,4]]
Object.assign(...arr.map(d => ({[d[0]]: d[1]})))

javascript#forEach하나를 사용하면 이 작업을 수행 할 수 있습니다

var result = {},
    attributes = ['a', 'b','c'];

attributes.forEach(function(prop,index) {
  result[index] = prop;
});

ECMA6 사용시 :

attributes.forEach((prop,index)=>result[index] = prop);

ES2016의 경우 객체의 연산자를 분산시킵니다. 참고 : 이것은 ES6 이후 이므로 트랜스 필러를 조정해야합니다.

const arr = ['a', 'b', 'c'];
const obj = {...arr}; // -> {0: "a", 1: "b", 2: "c"} 


FWIW, 하나는 또 다른 최근의 접근 방식은 새로운를 사용하는 것입니다 Object.fromEntries와 함께 Object.entries다음과 같다 :

const arr = ['a','b','c'];
arr[-2] = 'd';
arr.hello = 'e';
arr.length = 17;
const obj = Object.fromEntries(Object.entries(arr));

... 희소 배열 항목의 저장을 피 undefined하거나 null색인이 아닌 (예 : 비정 수, 숫자가 아닌) 키를 보존합니다.

arr.length그러나 포함되지 않은 을 추가 할 수 있습니다.

obj.length = arr.length;

빠르고 더러운 것 :

var obj = {},
  arr = ['a','b','c'],
  l = arr.length; 

while( l && (obj[--l] = arr.pop() ) ){};

빠르고 더러운 # 2 :

var i = 0
  , s = {}
  , a = ['A', 'B', 'C'];

while( a[i] ) { s[i] = a[i++] };

Lodash 3.0.0의로서 당신은 사용할 수 있습니다 _.toPlainObject을

var obj = _.toPlainObject(['a', 'b', 'c']);
console.log(obj);
<script src="https://cdn.jsdelivr.net/lodash/4.16.4/lodash.min.js"></script>


이를 통해 원하는 순서대로 키를 정의한 객체를 배열에서 생성 할 수 있습니다.

Array.prototype.toObject = function(keys){
    var obj = {};
    var tmp = this; // we want the original array intact.
    if(keys.length == this.length){
        var c = this.length-1;
        while( c>=0 ){
            obj[ keys[ c ] ] = tmp[c];
            c--;
        }
    }
    return obj;
};

result = ["cheese","paint",14,8].toObject([0,"onion",4,99]);

console.log(">>> :" + result.onion); "paint"를 출력 할 경우, 함수는 길이가 같은 배열을 가지고 있거나 빈 객체를 얻게됩니다.

다음은 업데이트 된 방법입니다

Array.prototype.toObject = function(keys){
    var obj = {};
    if( keys.length == this.length)
        while( keys.length )
            obj[ keys.pop() ] = this[ keys.length ];
    return obj;
};

방금 작성한 재귀 함수가 있습니다. 간단하고 잘 작동합니다.

// Convert array to object
var convArrToObj = function(array){
    var thisEleObj = new Object();
    if(typeof array == "object"){
        for(var i in array){
            var thisEle = convArrToObj(array[i]);
            thisEleObj[i] = thisEle;
        }
    }else {
        thisEleObj = array;
    }
    return thisEleObj;
}

다음은 예제입니다 ( jsFiddle ).

var array = new Array();
array.a = 123;
array.b = 234;
array.c = 345;
var array2 = new Array();
array2.a = 321;
array2.b = 432;
array2.c = 543;
var array3 = new Array();
array3.a = 132;
array3.b = 243;
array3.c = 354;
var array4 = new Array();
array4.a = 312;
array4.b = 423;
array4.c = 534;
var array5 = new Array();
array5.a = 112;
array5.b = 223;
array5.c = 334;

array.d = array2;
array4.d = array5;
array3.d = array4;
array.e = array3;


console.log(array);

// Convert array to object
var convArrToObj = function(array){
    var thisEleObj = new Object();
    if(typeof array == "object"){
        for(var i in array){
            var thisEle = convArrToObj(array[i]);
            thisEleObj[i] = thisEle;
        }
    }else {
        thisEleObj = array;
    }
    return thisEleObj;
}
console.log(convArrToObj(array));

결과 : 재귀 배열 대 객체


.reduce((o,v,i)=>(o[i]=v,o), {})

[문서]

또는 더 자세한

var trAr2Obj = function (arr) {return arr.reduce((o,v,i)=>(o[i]=v,o), {});}

또는

var transposeAr2Obj = arr=>arr.reduce((o,v,i)=>(o[i]=v,o), {})

바닐라 JS가있는 가장 짧은 것

JSON.stringify([["a", "X"], ["b", "Y"]].reduce((o,v,i)=>{return o[i]=v,o}, {}))
=> "{"0":["a","X"],"1":["b","Y"]}"

좀 더 복잡한 예

[["a", "X"], ["b", "Y"]].reduce((o,v,i)=>{return o[v[0]]=v.slice(1)[0],o}, {})
=> Object {a: "X", b: "Y"}

더 짧아짐 ( function(e) {console.log(e); return e;}=== 사용 (e)=>(console.log(e),e))

 nodejs
> [[1, 2, 3], [3,4,5]].reduce((o,v,i)=>(o[v[0]]=v.slice(1),o), {})
{ '1': [ 2, 3 ], '3': [ 4, 5 ] }

[/ 문서]


나는 이것을 간단히 할 것이다 Array.of(). 의 배열은 컨텍스트를 생성자로 사용할 수 있습니다.

비고 2 기능은 의도적으로 일반적인 공장 방법이다. 이 값이 Array 생성자 일 필요는 없습니다. 따라서 단일 숫자 인수로 호출 될 수있는 다른 생성자로 전송되거나 상속 될 수 있습니다.

따라서 Array.of()함수에 바인딩 하고 객체와 같은 배열을 생성 할 수 있습니다 .

function dummy(){};
var thingy = Array.of.apply(dummy,[1,2,3,4]);
console.log(thingy);

Array.of() 하나 를 사용 하면 배열 서브 클래 싱을 수행 할 수도 있습니다 .


당신이 사용할 수있는 경우 Map또는 Object.assign, 그것은 매우 간단합니다.

배열을 만듭니다.

const languages = ['css', 'javascript', 'php', 'html'];

아래는 인덱스를 키로 사용하여 객체를 만듭니다.

Object.assign({}, languages)

지도에서 위와 동일하게 복제

인덱스 기반 객체 {0 : 'css'}으로 변환합니다 .

const indexMap = new Map(languages.map((name, i) => [i, name] ));
indexMap.get(1) // javascript

값 기반 객체 {css : 'css is great'}으로 변환 ...

const valueMap = new Map(languages.map(name => [name, `${name} is great!`] ));
valueMap.get('css') // css is great

let i = 0;
let myArray = ["first", "second", "third", "fourth"];

const arrayToObject = (arr) =>
    Object.assign({}, ...arr.map(item => ({[i++]: item})));

console.log(arrayToObject(myArray));

또는 사용

myArray = ["first", "second", "third", "fourth"]
console.log({...myArray})


ES5-솔루션 :

사용 배열 프로토 타입 기능 '푸시''적용' 당신이 배열 요소와 객체를 채울 수 있습니다.

var arr = ['a','b','c'];
var obj = new Object();
Array.prototype.push.apply(obj, arr);
console.log(obj);    // { '0': 'a', '1': 'b', '2': 'c', length: 3 }
console.log(obj[2]); // c


다음과 같은 기능을 사용할 수 있습니다.

var toObject = function(array) {
    var o = {};
    for (var property in array) {
        if (String(property >>> 0) == property && property >>> 0 != 0xffffffff) {
            o[i] = array[i];
        }
    }
    return o;
};

이것은 희소 배열을보다 효율적으로 처리해야합니다.


coffeescript의 해결책은 다음과 같습니다.

arrayToObj = (arr) ->
  obj = {}
  for v,i in arr
    obj[i] = v if v?
  obj

angularjs를 사용하는 경우 jquery의 $ .extend와 동일한 효과 인 angular.extend를 사용할 수 있습니다.

var newObj = {};
angular.extend(newObj, ['a','b','c']);

참고 URL : https://stackoverflow.com/questions/4215737/convert-array-to-object



반응형