Sorting JavaScript Array Of Objects by two different values

Question

I have an object like this in JavaScript:

myArray[0] -> 0:"62", 1:8, 2:0, 3:"11"
myArray[1] -> 0:"62", 1:8, 2:0, 3:"15"
myArray[2] -> 0:"48", 1:8, 2:0, 3:"04"
myArray[3] -> 0:"48", 1:8, 2:0, 3:"01"
myArray[4] -> 0:"62", 1:8, 2:0, 3:"12"
myArray[5] -> 0:"48", 1:8, 2:0, 3:"02"
myArray[6] -> 0:"62", 1:8, 2:0, 3:"14"
myArray[7] -> 0:"48", 1:8, 2:0, 3:"03"

And I'm trying to make it to be like this:

myArray[0] -> 0:"48", 1:8, 2:0, 3:"01"
myArray[1] -> 0:"48", 1:8, 2:0, 3:"02"
myArray[2] -> 0:"48", 1:8, 2:0, 3:"03"
myArray[3] -> 0:"48", 1:8, 2:0, 3:"04"
myArray[4] -> 0:"62", 1:8, 2:0, 3:"11"
myArray[5] -> 0:"62", 1:8, 2:0, 3:"12"
myArray[6] -> 0:"62", 1:8, 2:0, 3:"14"
myArray[7] -> 0:"62", 1:8, 2:0, 3:"15"

As you see, I'm trying to sort it by myArray[i][0] at first, and then sort by myArray[i][3] based on the myArray[i][0] as index. I managed to sort by myArray[i][0] using

myObject.sort(function(a, b){ 
    return parseInt(a) - parseInt(b); 
});

How do I accomplish this with no libraries?

Answer 1

I suggest to sort in one run with chained comparison functions.

How Array#sort() works:

If compareFunction is supplied, the array elements are sorted according to the return value of the compare function. If a and b are two elements being compared, then:

• If compareFunction(a, b) is less than 0, sort a to a lower index than b, ie a comes first.

• If compareFunction(a, b) returns 0, leave a and b unchanged with respect to each other, but sorted with respect to all different elements. Note: the ECMAscript standard does not guarantee this behaviour, and thus not all browsers (eg Mozilla versions dating back to at least 2003) respect this.

• If compareFunction(a, b) is greater than 0, sort b to a lower index than a .
• compareFunction(a, b) must always return the same value when given a specific pair of elements a and b as its two arguments. If inconsistent results are returned then the sort order is undefined.

In this case the compare function has two groups, one for sorting index [0] and one sorting index [3] . If the value at index [0] is equal, the the sorting for index [3] is taken. Both groups are chained with a logical or || .

 var array = [["62", 8, 0, "11"], ["62", 8, 0, "15"], ["48", 8, 0, "04"], ["48", 8, 0, "01"], ["62", 8, 0, "12"], ["48", 8, 0, "02"], ["62", 8, 0, "14"], ["48", 8, 0, "03"]]; array.sort(function (a, b) { return a[0].localeCompare(b[0]) || a[3].localeCompare(b[3]); }); document.write('<pre>' + JSON.stringify(array, 0, 4) + '</pre>'); 

Answer 2

To me your variable looks like an Array (object indexed with integer keys) so, if it's the case, what about:

var ar = [
  ["62", 8, 0, "11"],
  ["62", 8, 0, "15"],
  ["48", 8, 0, "04"],
  ["48", 8, 0, "01"],
  ["62", 8, 0, "12"],
  ["48", 8, 0, "02"],
  ["62", 8, 0, "14"],
  ["48", 8, 0, "03"]
]

var result =  ar.map(function(a) {
  return {key: a.join(''), val: a}
}).sort(function(a, b){ 
  return parseInt(a.key, 10) - parseInt(b.key, 10);
}).map(function(a) {
  return a.val
})
console.log(result)

See this fiddle

Edit

The Object version:

var data = [{ 0:"62", 1:8, 2:0, 3:"11"},{ 0:"62", 1:8, 2:0, 3:"15"},
            { 0:"48", 1:8, 2:0, 3:"04"},{ 0:"48", 1:8, 2:0, 3:"01"},
            { 0:"62", 1:8, 2:0, 3:"12"},{ 0:"48", 1:8, 2:0, 3:"02"},
            { 0:"62", 1:8, 2:0, 3:"14"},{ 0:"48", 1:8, 2:0, 3:"03"}]

var result =  data.map(function(a) {
  return {key: [0,1,2,3].map(function(k) {return a[k]}).join(''), val: a}
}).sort(function(a, b){ 
  return parseInt(a.key, 10) - parseInt(b.key, 10);
}).map(function(a) {
  return a.val
})
console.log(result)

Updated fiddle

Edit 2

After @malixsys's comment, here's a more efficient way:

var result =  data.sort(function(a, b){ 
  return parseInt(a[0]+ a[1] + a[2] + a[3], 10) - parseInt(b[0]+ b[1] + b[2] + b[3], 10);
})

And corresponding updated fiddle