Sort Array Object with Multiple Keys: Javascript

Question

Well, I have an array objects with random values, Ex.

var arr = [
    { id:1001, date:"20-02-2014", Name: 'demo1' },
    { id:1004, date:"13-02-2014", Name: 'demo0' },
    { id:1000, date:"10-02-2014", Name: 'demo14' },
    { id:1004, date:"16-02-2014", Name: 'demo10' },
    { id:1006, date:"22-02-2014", Name: 'demo111' },
    { id:1003, date:"28-02-2014", Name: 'demo16' },
    { id:1000, date:"28-01-2014", Name: 'demo12' },
    { id:1004, date:"28-01-2014", Name: 'demo01' },
    { id:1000, date:"08-01-2014", Name: 'demo41' },
    { id:1006, date:"08-01-2014", Name: 'demo91' }
]

I wanted to sort this array firstly by key id & then by key date as,

Output:

sorted_arr = [
 {"id":1000,"date":"08-01-2014","Name":"demo41"}, //group1
 {"id":1000,"date":"28-01-2014","Name":"demo12"}, //group1
 {"id":1000,"date":"10-02-2014","Name":"demo14"}, //group1 
 {"id":1001,"date":"20-02-2014","Name":"demo1"},  //group2
 {"id":1003,"date":"28-02-2014","Name":"demo16"}, //group3
 {"id":1004,"date":"28-01-2014","Name":"demo01"}, //group4
 {"id":1004,"date":"13-02-2014","Name":"demo0"},  //group4
 {"id":1004,"date":"16-02-2014","Name":"demo10"}, //group4
 {"id":1006,"date":"08-01-2014","Name":"demo91"}  //group5
 {"id":1006,"date":"22-02-2014","Name":"demo111"} //group5
]

I tried few generic code to sort,

    // generic comparison function
    cmp = function(x, y){
      return x > y ? 1 : x < y ? -1 : 0; 
    };


    arr.sort(function(a, b){
       return cmp( 
          [cmp(a.id, b.id), cmp(a.date, b.date)], 
          [cmp(b.id, a.id), cmp(b.date, a.date)]
       );
    });

I referred few examples SO Example but not getting expected output. Please suggest me best way to get this.

Answer 1

First compare with id, then compare with date if id equal. But because your date is in invalid date format, extra work has to be done for letting it be recognized by Date.

sorted_arr = arr.sort(function(a, b) {
   return a.id - b.id || new Date(a.date.split('-').reverse().join('-')) - new Date(b.date.split('-').reverse().join('-'));
});

Edit: If you are guaranteed to have zeros in front of the 1-digit months and dates, then you could even not to parse to date:

sorted_arr = arr.sort(function(a, b) {
   return a.id - b.id || a.date.split('-').reverse().join('') - b.date.split('-').reverse().join('');
});

Answer 2

No need to create Date objects, just reorder the date string into a sortable string, example

This example assumes that your dates are in the same format DD-MM-YYYY and creates YYYYMMDD for the date sort.

Javascript

var arr = [
    { id:1001, date:"20-02-2014", Name: 'demo1' },
    { id:1004, date:"13-02-2014", Name: 'demo0' },
    { id:1000, date:"10-02-2014", Name: 'demo14' },
    { id:1004, date:"16-02-2014", Name: 'demo10' },
    { id:1006, date:"22-02-2014", Name: 'demo111' },
    { id:1003, date:"28-02-2014", Name: 'demo16' },
    { id:1000, date:"28-01-2014", Name: 'demo12' },
    { id:1004, date:"28-01-2014", Name: 'demo01' },
    { id:1000, date:"08-01-2014", Name: 'demo41' },
    { id:1006, date:"08-01-2014", Name: 'demo91' }
];

var sorted = arr.sort(function (a, b) {
    return a.id - b.id || a.date.split('-').reverse().join('') - b.date.split('-').reverse().join('');
});

sorted.forEach(function (element) {
    console.log(JSON.stringify(element));
});

Output

{"id":1000,"date":"08-01-2014","Name":"demo41"}
{"id":1000,"date":"28-01-2014","Name":"demo12"}
{"id":1000,"date":"10-02-2014","Name":"demo14"}
{"id":1001,"date":"20-02-2014","Name":"demo1"} 
{"id":1003,"date":"28-02-2014","Name":"demo16"} 
{"id":1004,"date":"28-01-2014","Name":"demo01"} 
{"id":1004,"date":"13-02-2014","Name":"demo0"}
{"id":1004,"date":"16-02-2014","Name":"demo10"}
{"id":1006,"date":"08-01-2014","Name":"demo91"} 
{"id":1006,"date":"22-02-2014","Name":"demo111"} 

On jsFiddle

If there is any concern over mixing date formats, as discussed with @xdazz, then you can improve on this by checking the padding yourself. The following creates the format 'YYYYYYMMDD' when sorting by the date. The extra year padding is not necessary in this example as I am taking the numeric difference of the values, but if you choose to compare the strings then it is important.

function pad(s, n) {
    var v = '',
        i;

    for(i = 0; i < n - s.length; i += 1) {
        v += '0';
    }

    return v + s;
}

var sorted = arr.sort(function (a, b) {
    var idDiff = a.id - b.id;

    if (idDiff) {
        return idDiff;
    }

    var ordA = a.date.split('-').reverse(),
        ordB = b.date.split('-').reverse();

    ordA[0] = pad(ordA[0], 6);
    ordA[1] = pad(ordA[1], 2);
    ordA[2] = pad(ordA[2], 2);
    ordA = ordA.join('');
    ordB[0] = pad(ordB[0], 6);
    ordB[1] = pad(ordB[1], 2);
    ordB[2] = pad(ordB[2], 2);
    ordB = ordB.join('');
    return ordA - ordB;
});

On jsFiddle

If you really want to use Date objects the I would suggest the following.

var sorted = arr.sort(function (a, b) {
    var idDiff = a.id - b.id;

    if (idDiff) {
        return idDiff;
    }

    var ordA = a.date.split('-').reverse(),
        ordB = b.date.split('-').reverse();

    ordA[1] -= 1;
    ordB[1] -= 1;

    return new Date(Date.UTC.apply(undefined, ordA)).valueOf() -  new Date(Date.UTC.apply(undefined, ordB)).valueOf();
});

sorted.forEach(function (element) {
    console.log(JSON.stringify(element));
});

On jsFiddle

Note: These examples do not handle dates with negative years, again you would need to make further modifications.