Sorting an array in JavaScript is done with <array>.sort()

sort() explanation in French
sort() explanation in English

It’s very easy and well explained in all JavasScript references.
When dealing with two-dimensional arrays or even worst with multi-dimensional arrays it’s another story.
Let me try to explain you thanks to clear examples.

How to sort a two-dimensional array ?

Let me explain it with simple examples.

Two-dimension data structure

var myArray = [
["DVD Title 1","label1","releasedate2","details1"],
["DVD Title 1","label3","releasedate1","details1"],
["DVD Title 1","label3","releasedate2","details1"],
["DVD Title 1","label2","releasedate1","details1"],
["DVD Title 1","label1","releasedate1","details1"],
["DVD Title 2","label2","releasedaten","detailsn"],
["DVD Title 2","label1","releasedaten","detailsn"]
];

Custom sort function to use

Example 1

If you want to sort by by all four elements of the sub arrays, you would use the following…

myArray.sort(mySorting);

function mySortingA(a,b) {
a = a[0]+a[1]+a[2]+a[3];
b = b[0]+b[1]+b[2]+b[3];
return a == b ? 0 : (a < b ? -1 : 1)
}

result = myArray.join(‘\n’);
alert(result);

Example 2

If you want to sort by only the second element, lable or [1], you would use the following…

function mySorting(a,b) {
a = a[1];
b = b[1];
return a == b ? 0 : (a < b ? -1 : 1)
}

Example 3

If you want to sort by the second element, lable or [1], and the third element, releasedate or [2], you would use the following…

function mySorting(a,b) {
a = a[1]+a[2];
b = b[1]+b[2];
return a == b ? 0 : (a < b ? -1 : 1)
}

Explanation about ‘a’ and ‘b’

‘a’ and ‘b’ are set to what you want to use for comparison.
‘a’ and ‘b’ are two special reserved variables that represent elements to be sorted.
‘a’ and ‘b’ are  represent the 1st & 2nd, 2nd & 3rd, 3rd & 4th, etc., elements to compare.

It’s good practice NEVER to use ‘a’ and ‘b’ as variables in your scripts.

The custom sorting function (called mySorting in the examples) needs to return -1, 0, or 1 to give you the sort order.
a < b returns -1
a = b returns 0
a > b returns 1

or to reverse the order
a < b returns 1
a = b returns 0
a > b returns -1

Ascending and descending sorting

A custom sorting function that ends with: return a == b ? 0 : (a < b ? -1 : 1) is ascending (Asc)

A custom sorting function that ends with: return a == b ? 0 : (a < b ? 1 : -1) is descending (Desc)

Sorting multi-dimentional arrays

Multi-dimensional data structure

var myArray = [
[["DVD Title 1","label1","releasedate2","details1"],’Ref001′,['Me',['2006','02','28','16:30']]],
[["DVD Title 1","label3","releasedate1","details1"],’Ref002′,['Me',['2006','06','11','11:30']]],
[["DVD Title 1","label3","releasedate2","details1"],’Ref003′,['Us',['2007','02','28','09:30']]],
[["DVD Title 1","label2","releasedate1","details1"],’Ref005′,['Us',['2006','06','15','16:00']]],
[["DVD Title 1","label1","releasedate1","details1"],’Ref004′,['He',['2007','02','28','12:30']]],
[["DVD Title 2","label2","releasedaten","detailsn"],’Ref007′,['He',['2008','02','28','13:30']]],
[["DVD Title 2","label1","releasedaten","detailsn"],’Ref006′,['We',['2008','05','28','16:30']]]
];

Data structure can be understand as list of DVD and for every DVD you have:

• several columns used to describe the DVD like title, label, release date and details
• the unique ID, the Reference of the DVD
• some metadata like a owner and a date splitted in year, month, day and time

This data data structure has from 2 to 4 dimensions:

• info about the DVD are stored in the third dimension
• the unique id in the second dimension
• the date in the metadata in the fourth dimension

Different examples of sorting

Example 1

If you want to sort by References and in the reverse order, you would use the following…

function mySorting(a,b) {
a = a[1];
b = b[1];
return a == b ? 0 : (a < b ? 1 : -1)
}

The expected Reference sequence is: 7 6 5 4 3 2 1

Example 2

If you want to sort by Labels, you would use the following…

function mySorting(a,b) {
a = a[0][1];
b = b[0][1];
return a == b ? 0 : (a < b ? -1 : 1)
}

The expected Reference sequence is: 1 4 6 5 7 2 3

Example 3

If you want to sort by the descending date in the metaData part of the data (column 3 of the data about a DVD, means a fourth dimension), you would use the following…

function value(a,b) {
a = a[2][1][0]+a[2][1][1]+a[2][1][2];
b = b[2][1][0]+b[2][1][1]+b[2][1][2];
return a == b ? 0 : (a < b ? 1 : -1)
}

The expected Reference sequence is: 6 7 3 4 5 2 1

Example 4

If you want to sort by the descending date and time in the metaData part of the data (second element of column 3 of the data about a DVD, means a fourth dimension), you would use the following…

function value(a,b) {
a = a[2][1][0]+a[2][1][1]+a[2][1][2]+a[2][1][3];
b = b[2][1][0]+b[2][1][1]+b[2][1][2]+b[2][1][3];
return a == b ? 0 : (a < b ? 1 : -1)
}

The expected Reference sequence is: 6 7 4 3 5 2 1

Tips to create the ‘a’ and ‘b’ sequence

It’s not very easy to find the right way of writing the ‘a’ and ‘b’ sequences.
If you can find ‘a’, ‘b’ should not be a problem

The idea is to find how will write the code to access the first entry of the element you want to sort by?

If you are looking for the Reference code in your data you will write something like this:

var myReference = myArray[0][1];

In the sorting function it becomes: a[1] and b[1]

If you are looking for the Label in your data you will write something like this:

var myReference = myArray[0][0][1];

In the sorting function it becomes: a[0][1] and b[0][1]

The time in the metaData is accessed with: var myTime = myArray[0][2][1][3];

In the sorting function its: a[2][1][3] and b[2][1][3]

Test page

You can use this test page to perform your own testing because of course your data structure will be different than the one provided in the examples.

Coming soon…

References