Arrays noch eigenen Vorgaben sortieren

Das Sortieren eines Arrays mit Zahlen sollte eigentlich kein Problem sein, allerdings hat JavaScript gerade hier so seine Tücken. Jedes Array-Objekt besitzt in JavaScript die Methode Array.sort(), die Sortierung erfolgt lexikographsich, das bedeutet, dass Zahlen wie Zeichenketten behandelt werden.

Hier ein kleines Beispiel, welches obige Aussage verdeutlicht:

var numbers = new Array();

numbers.sort();

Das Ergebnis:

Wie sie sehen, ist 20 < 3 und 9 > 80. Möchten Sie, dass Zahlen als Zahlen behandelt werden, müssen Sie eine Vergleicherfunktion (Comparator) definieren, die dieses leistet und diese Funktion der Methode Array.sort(Comparator) als Argument übergeben.

Dabei gilt folgende Regel:

Wenn der Comparator(a, b) eine Zahl kleiner als 0 liefert, sortiere b an einen kleineren Index als a
Wenn der Comparator 0 liefert, lass a und b unverändert stehen
Wenn der Comparator(a, b) eine Zahl kleiner als 0 liefert, sortiere b an einen größeren Index als a

/**
 * Dient als Comparator für die Methode Array.sort und
 * definiert eine aufsteigende Sortierung
 * @return 0, wenn beide Argumente gleich sind
 *  	Zahl < 0, wenn b größer als a ist
 *  	Zahl > 0, sonst
 */
function numComparisonAsc(a, b)	{
	return a-b;
}

// Aufruf:
numbers.sort(numComparisonAsc);

Das Beispiel liefert folgendes Ergebnis:

Nun möchten Sie vielleicht aber die Zahlen nicht aufsteigend, sondern absteigend (descending) sortiert haben? Kein Problem. Den Comparator (Vergleicher) definieren und anwenden:

/**
 * Dient als Comparator für die Methode Array.sort und
 * definiert eine absteigende Sortierung
 * @return 0, wenn beide Argumente gleich sind
 *  	Zahl > 0, wenn b größer als a ist
 *  	Zahl < 0, sonst
 */
function numComparisonDesc(a, b)	{
  return b-a;
}

numbers.sort(numComparisonDesc);

Mein Beispiel von oben liefert dann folgendes Ergebnis:

Wir können zusammen noch ein Beispiel machen:

Ein beliebter Einsatz einer Sortierfunktion ist der, dass Länder in einer Auswahlliste (Select-Element) dargestellt werden soll. Damit man bei Veränderungen dieser Liste nicht ständig darauf achten muss, an welcher Stelle eines Arrays ein Land alphabetisch einsortiert werden soll, schreibt man sie am besten in irgendeiner Reihenfolge auf und überlässt diese Aufgabe JavaScript.

Leider sortiert JavaScript dann meistens nicht so, wie man es gern hätte. Ein kleines Beispiel soll das verdeutlichen:

var index = 0;
var country = new Array();
country[index++] = "Vereinigte Arabische Emirate";
country[index++] = "deutschland";
country[index++] = "frankreich";
country[index++] = "ägypten";
country[index++] = "Österreich";
country[index++] = "Andorra";
country[index++] = "Osttimur";
country[index++] = "Dänemark";

Lässt man sich diese Liste sortieren und gibt sie aus, ergibt sich folgendes:

Wie man sieht, folgt Österreich nicht auf Osttimur und kleine Buchstaben werden nicht wie Großbuchstaben behandelt.

Um dieses Verhalten abzuändern, Sie ahnen es, definieren wir uns einen Comparator, der wie gewünscht sortiert. Die Sortierung von Zeichenketten erfolgt auf Basis jedes Characters der Zeichenkette.

/**
 * Dient als Comparator für die Methode Array.sort und
 * definiert, wie Characters verglichen werden sollen.
 * Ignoriert Groß- Kleinschreibung und sortiert Umlaute
 * zu den entsprtechenden Selbstlauten.
 * (ä == a, ß == s, usw.)
 * @param a erstes Argument
 * @param b zweites Argument
 * @return  0, wenn beide Argumente gleich sind
 *  	-1, wenn a größer als b ist
 *  	 1, sonst
 */
function stringComparison(a, b)	{
	a = a.toLowerCase();
	a = a.replace(/ä/g,"a");
	a = a.replace(/ö/g,"o");
	a = a.replace(/ü/g,"u");
	a = a.replace(/ß/g,"s");

	b = b.toLowerCase();
	b = b.replace(/ä/g,"a");
	b = b.replace(/ö/g,"o");
	b = b.replace(/ü/g,"u");
	b = b.replace(/ß/g,"s");

	return(a==b)?0:(a>b)?1:-1;
}

country.sort(stringComparison);

Ruft man jetzt die Sortierung mit unserem Comparator auf, sieht das Ergebnis der Sortierung folgendermaßen aus:

Dieses Vorgehen können Sie bei jedem Browser einsetzen, der JavaScript 1.2 beherrscht.

Dokumentation zu diesem Thema

Das Array Objekt und die Methode sort() in Netscapes Dokumentation.