Jquery map json arrays with $.map

Question

I am having confusion on how to do it with $.map function instead of regular $.each. I have json data like this.

var arr = {
 "x1" :[11,22,33],
 "y1":[44,55,66],
 "y2":[77,88,99]
};

And result should be array = [[x1,y1,y2], ...]

var result = [[11,44,77],[22,55,88],[33,66,99]];

And I want function to be dynamic , it should not depend on arr.x1 etc .For example If i give it array like

var arr2 = {
 "aaa" :[11,22,33],
 "sss":[44,55,66],
 "dd":[77,88,99],
 "dddd":[77,88,99],
};

It should add up all array like above dynamically as it have now 4 sub arrays so result should be three sub-arrays of four elements each. I should be able to do it with $.each etc but purpose is to learn $.map.

UPDATE: My guess is pure $.map solution will be something like nested maps:

_elements = $.map(_elements, function(e) {
    return [$.map(e,function(v) {
        return v;
    })];
});

Your arr array isn't actually an array; it's an object. As such, the order of your result can't be guaranteed. — Blazemonger
– Blazemonger, Commented Oct 4, 2013 at 16:01
You say arr2 should produce 4 sub-arrays. Don't you mean it should produce three sub-arrays of four elements each? — Blazemonger
– Blazemonger, Commented Oct 4, 2013 at 16:08
@Blazemonger, You are right.three sub-arrays of four elements each — django
– django, Commented Oct 4, 2013 at 16:14
Then you're not trying to map the object to an array; you're trying to transpose a matrix. $.map is a one-to-one transformation engine. — Blazemonger
– Blazemonger, Commented Oct 4, 2013 at 16:15
Agree with @Blazemonger - in fact you should definitely not use variable names like arr and arr2, because these names will confuse you into thinking the objects are arrays when they are not. — Michael Geary
– Michael Geary, Commented Oct 4, 2013 at 16:30

Denys Séguret · Accepted Answer · 2013-10-04 16:06:55Z

3

You can build your array like this :

var arr = {
 "x1" :[11,22,33],
 "y1":[44,55,66],
 "y2":[77,88,99]
};
var keys = Object.keys(arr), result = [], l=arr[keys[0]].length;
for(var i=0; i<l; i++) result.push($.map(keys, function(k){ return arr[k][i] }));

This builds exactly the array you're asking for.

Demonstration

edited Oct 4, 2013 at 16:06

answered Oct 4, 2013 at 16:01

Denys Séguret

384k90 gold badges813 silver badges780 bronze badges

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

4 Comments

django Over a year ago

Yes it does work. But is it doable purely in $.map ? by using nestes $.map ?

Blazemonger Over a year ago

@django I don't see how. $.map uses an implicit loop through each property of the object, each of which is unconnected to the other properties. A map is a one-to-one transformation. You seem to want a transposition.

Blazemonger Over a year ago

And we are politely informing you that your guess is wrong. :-)

Denys Séguret Over a year ago

If you want to use $.map a little more, you can build the keys array like this : var keys = $.map(arr, function(_,k){ return k}). But, just like @Blazemonger, I fail to see how nested $.map could be used here (and more importantly why complicate the code just to nest $.map).

Collectives™ on Stack Overflow

Jquery map json arrays with $.map

1 Answer 1

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related