分割对象数组

Question

Is there a way of changing my array of objects into a few seperate arrays for each property of my objects?

For example, I have this:

[ 
    { 
        date: Mon Aug 08 2016 16:59:16 GMT+0200 (CEST),
        visits: 0,
        hits: 578,
        views: 5131 
    },
    { 
        date: Tue Aug 09 2016 16:59:16 GMT+0200 (CEST),
        visits: -1,
        hits: 548,
        views: 722 
    },
    { 
        date: Wed Aug 10 2016 16:59:16 GMT+0200 (CEST),
        visits: -1,
        hits: 571,
        views: 4772 
    }
]

And I want it to look like this:

var dates = ["date1", "date2", ...],
    visits = ["visit1", "visit2", ...],
    hits = ["hits1", "hits2", ...],
    views = ["view1", "view2", ...];

So that I can use it with plot.ly.

Answer 1

You can use the map function:

 var array = [ { "date": 'Mon Aug 08 2016 16:59:16 GMT+0200 (CEST)', visits: 0, hits: 578, views: 5131 }, { "date": 'Tue Aug 09 2016 16:59:16 GMT+0200 (CEST)', visits: -1, hits: 548, views: 722 }, { "date": 'Wed Aug 10 2016 16:59:16 GMT+0200 (CEST)', visits: -1, hits: 571, views: 4772 }]; var dates = array.map(item => item.date); var visits = array.map(item => item.visits); var hits = array.map(item => item.hits); var views = array.map(item => item.views); console.log(dates, visits, hits, views); 

Answer 2

You can use reduce and destructuring

 var arr = [ { date: "Mon Aug 08 2016 16:59:16 GMT+0200 (CEST)", visits: 0, hits: 578, views: 5131 }, { date: "Tue Aug 09 2016 16:59:16 GMT+0200 (CEST)", visits: -1, hits: 548, views: 722 }, { date: "Wed Aug 10 2016 16:59:16 GMT+0200 (CEST)", visits: -1, hits: 571, views: 4772 } ]; let keys = ['date','visits','hits','views'], [dates, visits, hits, views] = arr.reduce( (a,b) => { return keys.map( (x,i) => {a[i].push(b[x])}), a; }, [[],[],[],[]]); console.log(dates, visits, hits, views) 

 .as-console-wrapper {top: 0; max-height: 100%!important} 

Answer 3

You could iterating the array and push the same keys to the same key in an object.

This answer utilized an object, opposite of the wanted results in single variables. The advantage is to keep all data combined and not spreaded over the code in different variable.

The use is easy with just the reference by property.

 var data = [{ "date": 'Mon Aug 08 2016 16:59:16 GMT+0200 (CEST)', visits: 0, hits: 578, views: 5131 }, { "date": 'Tue Aug 09 2016 16:59:16 GMT+0200 (CEST)', visits: -1, hits: 548, views: 722 }, { "date": 'Wed Aug 10 2016 16:59:16 GMT+0200 (CEST)', visits: -1, hits: 571, views: 4772 }], object = { date: [], visits: [], hits: [], views: [] }, keys = Object.keys(object); data.forEach(function (a) { keys.forEach(function (k) { object[k].push(a[k]); }); }); console.log(object); 

Answer 4

IMHO it will be difficult to make without loop.

This code might be simpler:

var data =  [
{ date: "Mon Aug 08 2016 16:59:16 GMT+0200 (CEST)", visits: 0, hits: 578, views: 5131 },
{ date: "Tue Aug 09 2016 16:59:16 GMT+0200 (CEST)", visits: -1, hits: 548, views: 722 },
{ date: "Wed Aug 10 2016 16:59:16 GMT+0200 (CEST)", visits: -1, hits: 571, views: 4772 }
];

var getArrayByValue = function(data, key) {
    var result = [];
    for (i in data) {
        result.push(data[i][key])
    }
    return result;
}

var dates = getArrayByValue(data, 'date')
var visits = getArrayByValue(data, 'visits')
var hits = getArrayByValue(data, 'hits')
var views = getArrayByValue(data, 'views')