Sorteren op eigenschappen van objecten (Javascript)

03-02-2010

De prestatie van een web applicatie kan behoorlijk verbeterd worden door het sorteren van informatie client side binnen de browser uit te voeren.

In dit voorbeeld wordt de constructor 'person' aangemaakt met de attributen 'FirstName', 'LastName' en 'Age'.

De javascript sort functie wordt vervolgens gebruikt om de personen (het people array met objecten) op leeftijd te sorteren.

Let op dat numeriek sorteren en het sorteren op een string iets anders werkt. Bekijk daarvoor het verschil tussen de functie sortByAge en sortByFirstName.

Een werkend voorbeeld:

<script type="text/javascript">
<!--

// defineer personen
var people = new Array();
people[people.length++] = new person("Tina", "Kroeg", 24);
people[people.length++] = new person("Corie C.", "Hefelcruim", 20);
people[people.length++] = new person("Ernie", "Schijnepesens", 27);
people[people.length++] = new person("Aridun", "Ringoor", 27);

// sorteer op leeftijd
people.sort(sortByAge);

//sorteer op voornaam
// people.sort(sortByFirstName);

// sorteer op achternaam
//people.sort(sortByLastName);

// toon de gebruikers volgens nieuwe sortering
for(i=0;i<people.length;i++){
alert(people[i].FirstName + " " + people[i].LastName + " ("+people[i].Age+")");
}

// structuur van het object persoon
function person(firstName, lastName, age) {
this.FirstName = firstName;
this.LastName = lastName;
this.Age = parseInt(parseFloat(age));
}

// sorteer functies
function sortByAge(a,b){
x = parseInt(a.Age);
y = parseInt(b.Age);
return x - y;}

function sortByFirstName(a, b) {
var x = a.FirstName.toLowerCase();
var y = b.FirstName.toLowerCase();
return ((x < y) ? -1 : ((x > y) ? 1 : 0));
}
function sortByLastName(a, b) {
var x = a.LastName.toLowerCase();
var y = b.LastName.toLowerCase();
return ((x < y) ? -1 : ((x > y) ? 1 : 0));
}

// -->

</script>

<

Kolommen van tabel sorteren HTML/javascript

Rekenen met data in javascript

>

Zie ook:

• Dagtip archief van februari 2010
• Het volledige dagtip archief vanaf 2005



twitter

dagtip

twing!

zoeken

zoek

dagtip

populair

IIS uitbreiden voor het streamen van video's
Babel Fish voor vertalen van Engels Nederla...
Bestanden beveiligd onderling delen uit de ...
International Bank Account Number(IBAN) con...
Speeltuin voor programmeurs
Clieop03 class voor PHP
iDeal logo's & huisstijl
FTP site als Windows map in verkenner/explo...
Subversion voor Windows (server & client)
Mail server blacklist controle

blog

links

permalink


© 2005-2012, Twing IT, internetbureau Rotterdam

Internetbureau twing!

Laan op Zuid 157

Rotterdam, Zuid-Holland, 3072 DB Nederland

+31104334316

internetbureau rotterdam

Internetbureau twing!

Laan op Zuid 157, Rotterdam, Zuid-Holland.

+31104334316 http://www.twing.nl/