How to merge 2 javascript objects into an array?

Question

I have objects like this:

{ "aa": "11", "bb" : "22", "cc" : "33" }
{ "aa": "text1", "bb" : "text2", "cc" : "text3" }

I need to merge these to become this array

[ ["text1", "11"], ["text2", "22"], ["text3", "33"] ]

Is there an easy way to do this?

I know I can do this with a couple loops of course, but is there an easier way? — trashrobber
– trashrobber, Commented May 2, 2014 at 4:09
define "easier". Is 3 lines solution with loops "complicated" for you? — zerkms
– zerkms, Commented May 2, 2014 at 4:11
AnArray = [{Objectname: ObjectValue, Objectname2: ObjectValue2},{Objectname: ObjectValue, Objectname2, ObjectValue2}]; Then: AnArray[Index#].Objectname1(or 2 or whatever you use for Object Name) Do you mean like this example Object Array? — Brendan
– Brendan, Commented May 2, 2014 at 4:12
I guess i was hoping for something like python zip, but a simple loop would work fine. Thanks — trashrobber
– trashrobber, Commented May 2, 2014 at 4:15

Community · Accepted Answer · 2017-05-23 12:11:14Z

5

Here is some JS FP just for fun:

var o1 = { "aa": "11", "bb" : "22", "cc" : "33" },
    o2 = { "aa": "text1", "bb" : "text2", "cc" : "text3" };

var values = function(obj) {
    return Object.keys(obj).map(function(key) {
        return obj[key];
    });
};

function zip(arrays) {
    return arrays[0].map(function(_,i){
        return arrays.map(function(array) {
            return array[i];
        });
    });
}

var zipped = zip([
    values(o1),
    values(o2)
]);

console.log(zipped);

http://jsfiddle.net/q3P2h/

PS: zip function implementation borrowed at https://stackoverflow.com/a/10284006/251311

edited May 23, 2017 at 12:11

CommunityBot

11 silver badge

answered May 2, 2014 at 4:12

zerkms

256k73 gold badges447 silver badges550 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

trashrobber Over a year ago

Thanks for the posting zip implementation, that will be useful anyway. I accepted the other answer though because it is simpler.

Dileep Over a year ago

@zerkms what does the function(_,i) means ?

zerkms Over a year ago

@Dileep: it's an anonymous function that accepts 2 arguments: 1st is with _ name, second is with i. Keeping in mind .map() passes the value and the key - the former one will be the value, the second is the key. _ is just a "conventional" name for an argument to be discarded - you may have noticed it's not used, but only i. And as soon as we need i - we cannot omit the first argument hence need to give it some name. PS: ask if my tangled description is hard to get :-)

Dileep Over a year ago

@zerkms Dude you got some supercomputer in your head..!! Took a while understand but the logic is awesome ;-)

zerkms Over a year ago

@Dileep: it's not me - I borrowed it (and put a credit for it) at stackoverflow.com/a/10284006/251311 But it's "simple" to reinvent it anyway isn't it?

|

thefourtheye · Accepted Answer · 2014-05-02 04:28:04Z

var objects = [{
    "aa": "11",
    "bb": "22",
    "cc": "33"
}, {
    "aa": "text1",
    "bb": "text2",
    "cc": "text3"
}];
var result = [];
for (var key in objects[1]) {
    result.push([objects[1][key], objects[0][key]]);
}
console.log(result);
# [ [ 'text1', '11' ], [ 'text2', '22' ], [ 'text3', '33' ] ]

Or

console.log(Object.keys(objects[1]).map(function(key) {
    return [objects[1][key], objects[0][key]];
}));
# [ [ 'text1', '11' ], [ 'text2', '22' ], [ 'text3', '33' ] ]

If you had the objects in two different variables, like this

var o1 = { "aa": "11", "bb" : "22", "cc" : "33" },
    o2 = { "aa": "text1", "bb" : "text2", "cc" : "text3" };

then

console.log(Object.keys(o2).map(function(key) {
    return [o2[key], o1[key]];
}));
# [ [ 'text1', '11' ], [ 'text2', '22' ], [ 'text3', '33' ] ]

Avishek · Accepted Answer · 2014-05-02 04:29:28Z

1

An easier way could be :

var a = { "aa": "11", "bb": "22", "cc": "33" };
var b = { "aa": "text1", "bb": "text2", "cc": "text3" };
var c=[];
$.each(a, function (index, value) {
    c.push(a[index], b[index]);
});

PS: Using jQuery.

edited May 2, 2014 at 4:29

answered May 2, 2014 at 4:18

Avishek

1,89615 silver badges33 bronze badges

8 Comments

zerkms Over a year ago

1. what is $? 2. {} doesn't have push method

zerkms Over a year ago

Still, what the heck is $?

Avishek Over a year ago

are you using jquery or only javascript?

zerkms Over a year ago

I'm not an OP. And there is no any jquery in question tags. If third party libraries were allowed - it would be one line solution: _.zip (underscorejs.org/#zip)

Avishek Over a year ago

$ is the jquery object

|

Aniket · Accepted Answer · 2014-05-02 04:39:21Z

0

Folks Try this one. Hope so it will work for you.

    var x = { "aa": "11", "bb" : "22", "cc" : "33" }
    var y = { "aa": "text1", "bb" : "text2", "cc" : "text3" }

    var a = [];

    var b = [];

    for(var k in x){ a.push(k);}

    for(var i = 0; i<a.length;i++){
    var c = [];
    c.push(x[a[i]]);
    c.push(y[a[i]]);
    b.push(c);
    c = [];





    }

console.log(b);

Thanks and regards.

answered May 2, 2014 at 4:39

Aniket

1181 silver badge7 bronze badges

Collectives™ on Stack Overflow

How to merge 2 javascript objects into an array?

4 Answers 4

6 Comments

Comments

8 Comments

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

6 Comments

Comments

8 Comments

Comments

Linked

Related