Transforming an array into an object?

Question

I'm trying to transform the following array of objects into an object that contains the label property as the key to multiple arrays of objects containing that same key as the property.

Here's a JSBin of a function that maps the array but I'm not sure about the ES6 logic I would use to get the output I want.

https://jsbin.com/foyijisaku/1/edit?js,console

original array

var originalArray =

    [
      {
        'id': 6,
        'label': 'hello'
      },
      {
        'id': 5,
        'label': 'hello'
      },
      {
        'id': 4,
        'label': 'bye'
      },
      {
        'id': 3,
        'label': 'bye'
      },
      {
        'id': 2,
        'label': 'bye'
      },
      {
        'id': 1,
        'label': 'bye'
      }
    ]

new object

var newObject =

    {
        'hello': [
            {
                'id': 6,
              'label': 'hello'
            },
            {
                'id': 5,
              'label': 'hello'
            },
        ],
        'bye': [
            {
                'id': 4,
              'label': 'bye'
            },
            {
                'id': 3,
              'label': 'bye'
            },
            {
                'id': 2,
              'label': 'bye'
            },
            {
                'id': 1,
              'label': 'bye'
            },
        ]
    }

You'll need to manually write your own reducer. Check out https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/Reduce — jaybee, Jun 21 '16 at 22:47

topheman · Accepted Answer · 2016-06-21T22:48:12.560

var originalArray =

    [
      {
        'id': 6,
        'label': 'hello'
      },
      {
        'id': 5,
        'label': 'hello'
      },
      {
        'id': 4,
        'label': 'bye'
      },
      {
        'id': 3,
        'label': 'bye'
      },
      {
        'id': 2,
        'label': 'bye'
      },
      {
        'id': 1,
        'label': 'bye'
      }
    ]

var newObject = originalArray.reduce(function(accumulator, current) {
  accumulator[current.label] = accumulator[current.label] || [];
  accumulator[current.label].push({
    id: current.id,
    label: current.label
  });
  return accumulator;
}, {})

In ES6, with spread operator:

var newObject = originalArray.reduce((accumulator, current) => {
  accumulator[current.label] = accumulator[current.label] || [];
  accumulator[current.label].push({...current});
  return accumulator;
}, {})

The reason why current is not directly pushed is to avoid keeping reference.

Thanks a lot, going to spend some time going through this code. — eveo, Jun 21 '16 at 23:01

score 0 · Answer 2 · answered Jun 21 '16 at 22:41

0

You need to iterate over the entire array. You can do this with a for...in loop.

var newObject;
for(var o in originalArray){
    if(o.label == 'hello'){
        var len = object['hello'].length;
        object['hello'][len] = o;
    }else{
        var len = object['bye'].length;
        object['bye'][len] = o;
    }
}

answered Jun 21 '16 at 22:41

zfj3ub94rf576hc4eegm

1,084
9
24

[Don't use `for...in` for arrays.](http://stackoverflow.com/questions/9329446/for-each-over-an-array-in-javascript) Use a normal `for` loop or [`forEach`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach) – Mike Cluck Jun 21 '16 at 22:54

Transforming an array into an object?

2 Answers2