Liens sponsorisés
 
Les bases de la programmation - Partie 2
par sky , le Jeudi 02 septembre 2004

2.3 Les fonctions et propriétés des listes

Comme pour les chaînes de caractères, les listes sont des objets qui ont des fonctions et des propriétés dédiées. Comme pour les chaînes, elles sont nombreuses et nous ne verrons que les plus usitées et les plus intéressantes.

2.3.1 La longueur

La première est une propriété que vous connaissez déjà, que l'on a vue avec les chaînes. Cette fonction est aussi utilisé sur d'autres objets que l'on ne verra pas pour le moment.
La propriété length a donc exactement le même fonctionnement. Pour rappel, elle ne prend aucun paramètre et renvoie une valeur numérique.

// initialisation
var list = [ 0, 1, 2, 3, 4 ];

//affichage de la longueur de la liste
alert ( 'La liste contient ' + list.length + ' elements.' );

2.3.2 Le tri 

La fonction sort permet de trier les éléments d'une liste. Elle est capable de trier des éléments numériques, de chaînes ou autres. Le tri est croissant. La fonction ne prend aucun paramètre et renvoie forcément une liste.
Dans les exemples nous allons trier plusieurs listes pour voir le comportement du Javascript sur les tris.
Commencons par trier une liste qui contient exclusivement des numériques :

// initialise une liste de numeriques
var list_num = [ 4, 7, 1, 3, 2, 6 ];

// affiche la liste triee
alert ( 'La liste triee est ' + list_num.sort() + '.' );
Voyons maintenant une liste qui ne contient que des chaînes, remarquez bien que le dernier élément est une chaîne contenant un numérique et pas un numérique directement :
// initialise une liste de chaines
var list_string = [ 'disque', 'souris', 'clavier', 'ecran', 'G5', 'Altivec', '1984' ];

// affichage
alert ( 'La liste triee est ' + list_string.sort() + '.' );
Toujours avec des chaînes uniquement, on vérifie les tris selon les majuscules et les minuscules. Pour être sûr que les mots soient strictement identiques, nous allons utiliser nos connaissances sur les chaînes : 
// initialisation
var mot = 'Macintosh';
var list = [ mot.toLowerCase(), mot.toUpperCase ];

//affichage du resultat
alert ( 'La liste triee est ' + list.sort() + '.' );
Si l'on mélange, maintenant, des chaînes et des numériques dans la même liste, il faudra bien faire attention aux chaînes contenant des numériques et les numériques, car lors de l'affichage du résultat, ils seront écrits de la même manière :
// initialisation
var the_list = ['Apple', 'apple', '1984', 1024, 64];

// affichage de la liste
alert ( 'La liste triee est ' + the_list.sort() + '.' );

Malheureusement, nous ne sommes pas en mesure de faire ici tous les tests possibles sur les tris. D'une part, parce que nous n'avons pas connaissance de tous les objets existants, d'autre part et plus simplement, nous n'avons pas testé des chaînes avec des caractères spéciaux ou des numériques réels ( avec des chiffres après la virgule ) ou encore des numériques négatifs.

Il peut être intéressant de faire ces derniers tests par vous même, vous aurez ainsi une idée des résultats. Il est toujours important d'avoir une idée de certains résultats, surtout les plus simples, lors des débugages d'un programme, la solution à un comportement bizarre peut être rapidement trouvée.

Comme pour les chaînes de caractères, nous n'avons vu qu'une infime parti des possibilités qu'offrent les listes.

2.4 L'évolution des listes : les matrices

Cette partie sera certainement la plus compliquée que nous verons ensemble. Cette partie n'est actuellement pas indispensable, vous pouvez donc la passer, même si il sera important d'y revenir plus tard, quand la compréhension générale de la programmation sera acquise. La compréhension du fonctionnement des listes est extrêmement importante pour poursuivre cette partie.

Ce concept est simple : si une liste peut contenir tout type d'objets, elle peut alors contenir elle même une liste. Nous obteneons donc, une liste de liste, autrement dit, des matrices ( terme bien connu depuis le film Matrix ).

Voyons directement un exemple, dans lequel nous allons créer une petite matrice de 2 sur 2. Vous allez comprendre qu'à partir de ce concept simple, on peut obtenir des objects très complexes qui ne sont pas forcément aisés à décrypter.

// nous creons une liste simple
var neo = [];

// dans cette liste, nous creons d autres listes
neo [ 0 ] = [ ];
neo [ 1 ] = [ ];

// dans chacune des cases de la matrice nous ajoutons une valeur
// nous remplissons la premiere liste
neo [ 0 ][ 0 ] = 2;
neo [ 0 ][ 1 ] = 4;
// nous remplissons la seconde liste
neo [ 1 ][ 0 ] = 6;
neo [ 1 ][ 1 ] = 8;

La matrice est maintenant créée. Si l'on considère que chaque élément de notre variable neo est une ligne, la matrice peut être symbolisée de cette manière :

 01
0
24
1
6
8


Il est possible de créer une matrice de manière plus concise, on peut écrire les listes directement les unes dans les autres. Comme dans les listes simples on peut travailler sur les valeurs contenues dans ces listes.

// initialisation d une matrice 2x2 avec des valeurs
// comme dans une liste on ecrit les elements separes par une virgule
var morpheus = [ [ 1, 2 ], [ 3, 4 ] ];

// je modifie la case 0,1 de ma matrice
morpheus[0][1] += 4;

// j affiche juste la valeur modifiee
alert ('La nouvelle valeur est :' + morpheus[0][1] + '.' )

L'affichage des matrices, dans une alerte par exemple n'est pas des plus intéressante; en effet, le Javascript colle bout à bout toutes les sous-listes, et l'on ne distingue plus la séparation entre chacune d'elle. On affichera donc plutot un élément d'une sous-liste, ou une sous-liste.

Ces matrices sont très utilisées en informatique. Sur un exemple concret :
Votre écran a une résolution bien précise, si l'on prend les écrans Apple Display :
- Le 20 pouces a une résolution de 1680 x 1050
- Le 23 pouces a une résolution de 1920 x 1200
- Le 30 pouces a une résolution de 2560 x 1600

Chaque pixel est un point de l'écran, on peut donc imaginer une matrice de la taille nécessaire pour stocker la valeur de chaque couleur de chaque pixel de l'écran. Et l'ordinateur utilisant cette matrice pour afficher ce que vous voyez à l'écran.

Une variable prend de l'espace en mémoire, sachant qu'une matrice est d'une taille des résolutions que l'on a vues, l'espace mémoire occupé est très important.
On comprends donc pourquoi il faut une carte graphique avec 32 Mo de mémoire pour
le 23' et une carte 128 Mo pour le 30'.

Bien sûr, tous ces systèmes sont bien plus compliqués que ca, l'exemple a été très largement simplifié pour une bonne compréhension.

Maintenant que vous avez compris le principe des matrices, qu'est ce qui nous empêche d'imaginer des listes à plus de deux dimensions? La réponse est : Rien. Nous pouvons créer une liste dans une liste dans une liste par exemple.

Attention cependant, l'utilisation de listes aussi complexes nécessite d'y réfléchir longuement avant, il est souvent trés difficile d'utiliser ce genre de listes et il n'est pas rare de faire des erreurs rapidement noyées dans les lignes de code et les différents niveaux des listes.

 

 
Powered by CaMykS