Question

I am interested in how you would sort the following data most effectively with jQuery:

There is a json object which I retrieve from the server:

var data = {/*json-object*/};
$.each(data.level1.sub1, function(){
    if(this.name.length < 2) {
        this.type = "banana";
        itemarray.push(this);
    }
    else {
        this.type = "apple";
        itemarray.push(this);
    }
});

$.each(data.level2.sub1, function(){
    this.type = "kiwi";
    itemarray.push(this);
});

This brings me to the point that I can list what’s in the array (which is typeof object, not a “real” array) by doing this:

if (itemarray.length){
    $.each(itemarray, function(index, value){
      $('#wrapper').append('<li>' + index + ' : ' + value.name + ' * ' + value.type + '</li>');
    });
}  

Result:

0 : abc * apple
1 : a * banana
2 : lala * apple
3 : bcd - Copy * kiwi
4 : okl * banana

Now I would like to sort the array (which is typeof object, again): group by type and sort asc per type. How would you suggest doing that?

Answer 1

Since you’re using the itemarray.push method, I assume that itemarray is a true array. Array objects (note: typeof [] === "object") support a sort() method.

Use the native Array.sort method, in conjunction with a function, as shown below. This method directly modifies the array.

var itemarray = [{type:"C"},{type: "B"}]; //Your array looks like this

//ASC result: [{type:"C"}, {type:"B"}]
itemarray.sort(function(x,y){
    return x.type.localeCompare(y.type);
});
//DESC result: [{type:"B"}, {type: "B"}]
itemarray.sort(function(x,y){
    return y.type.localeCompare(x.type);
});