Les bases de la programmation - Partie 2
Avant de commencer la lecture de cet article il est important de bien avoir assimilé l'article précédent, il en est la suite directe. Les notions vues dans la première partie seront sans cesse utilisées dans cet article.
Dans cette seconde partie, nous allons continuer le travail sur les variables, nous allons traiter des chaînes de caractères ainsi que des listes de variables.
Comme dans le précédent article, les bouts de code seront nombreux et agrémentés de commentaires complets pour faciliter au maximum votre compréhension.
1. Utilisation d'une chaîne de caractères.
1.1 L'initialisation
Une chaîne de caractères est un texte contenu dans une variable, une suite de caractères. Ces chaînes de caractères sont appelées "string" en anglais.
Les strings sont notées entre guillemets, pour faire la différence avec l'attribution de valeurs numériques. Pour initialiser une string en javascript, rien de plus simple:
// initialisation de la variable, elle contient le texte text var ma_variable = "text"; // affichage de celle ci alert ( ma_variable )
L'initialisation peut se faire d'une autre manière, plus propre mais qui revient exactement au même. Cette notation fait appel à des notions d'objets. Elle est normalement l'écriture que l'on devrait employer à chaque fois. En fait, le javascript est assez souple pour permettre la notation précédente.
// initialisation de manière objet var ma_variable = new String ( "text" ); alert ( ma_variable );
1.2 Les opérations
Le seul opérateur simple sur les chaînes est l'addition, aussi appelée la concaténation, comme pour les numériques, elle se note avec l'opérateur '+'. Lors de la concaténation, faites attention aux espaces entre les mots que vous allez "coller", il faudra peut être rajouter une chaîne contenant un espace aux endroits opportuns.
// initialisation de mes variables var str1 = 'Bienvenue'; // exemple de concatenation var str2 = 'Vous lisez un article' + ' qui est au top ;).'; // concatenation d une nouvelle chaine str1 = str1 + ' sur skymac!'; // affichage de str1 mis a jour alert ( str1 ); // concatenation des deux variables, j'ajoute str2 a str1 str1 += " " + str2; // affichage de str1 de nouveau mis à jour alert ( str1 );
Cette concaténation ne se limite pas aux seules chaînes. Vous pouvez ajouter toutes sortes de types de variables à vos chaînes.
Par exemple des numériques, pour bien montrer toutes les différences nous allons additionner tour à tour des numériques et des chaînes :
// initialise toutes mes variables // les numériques var num1 = 3; var num2 = 4; // les strings var str1 = 'chaine'; var str2 = 'string'; // différents tests alert ( num1 + num2 ); alert ( str1 + str2 ); alert ( str1 + num1 ); alert ( num1 + str1 );
Comme vous avez pu le remarquer, la chaîne prend la priorité sur les numériques, quel que soit l'ordre lors de la concaténation, lorsque l'on ajoute un numérique à une chaîne, la valeur résultante est une chaîne aussi.
Si l'on additionne deux numériques et une chaîne, on obtient :
// initialise toutes mes variables // les numeriques var num1 = 3; var num2 = 4; // la chaine var str1 = "chaine"; // addition de deux numeriques et d'une chaine alert ( str1 + num1 + num2 );
Si on veut afficher la somme de deux numériques dans une chaîne, il suffit, comme en mathématique, d'ajouter des parenthèses. Ces parenthèses vont forcer l'addition mathématique avant la concaténation de la chaîne et de la somme.
// initialise toutes mes variables // les numériques var num1 = 3; var num2 = 4; // la string var str1 = "somme = "; // addition de deux numériques que l'on ajoute à une chaîne alert ( str1 + ( num1 + num2 ) );
1.3 Les fonctions dédiées
La seule concaténation ne permet pas de manipuler des chaînes de manière efficace. Pour cela, de nombreuses fonctions sont dédiées au traitement des chaînes. Nous ne verons ici qu'un petit nombre de ces fonctions, les plus basiques et les plus usitées. Le site DevEdge de Netscape est une excellente source pour le javascript, cette page vous donne la liste des fonctions attribuées aux objets "chaîne de caractère". Vous trouverez facilement sur internet d'autres sites spécialisés dans le javascript.
Les chaines possèdent aussi des propriétés auquelles on accéde de la même manière que les fonctions : la notation pointée.
Le bout de code qui suit n'est pas fonctionnel, il ne sert que d'exemple pour cette notation pointée :
// exemple de fonction chaine.fonction( parametres ); // exemple de propriété chaine.propriete;
1.3.1 La longueur
Il est souvent pratique de connaitre la longueur d'une chaîne. Cela se fait par la propriété "length" qui renvoie un résultat numérique :
// j initialise une chaîne var welcome = "bienvenue"; // je calcule la longueur et l attribue dans une nouvelle variable var welc_long = welcome.length; // j affiche de manière smart le résultat alert ( 'La longueur de la chaine est : ' + welc_long + '.' );
1.3.2 Construction d'une sous chaîne
Il est possible de récupérer une partie d'une chaîne avec la fonction substring. Cette fonction prend en charge deux paramètres numériques positifs et renvoie une chaîne de caractères.
Les deux numériques sont les positions de début et de fin, la fonction prend comme paramètre de début le plus petit numérique donné et donc logiquement le paramètre fin est le plus grand.
Alors que le premier caractère (à la position définie par le paramètre le plus petit) est inclus, le dernier (à la position définie par l'autre paramètre) ne l'est pas.
De plus une chaîne a comme index du premier caractère 0 et comme index du dernier, la longueur de la chaîne à laquelle on soustrait 1.
Mais les exemples seront certainement plus parlants. Dans ce premier exemple, nous allons juste récupérer un bout d'une chaîne.
// initialisation var chaine = "Coucou"; // création d une nouvelle chaîne avec un morceau de la chaîne initiale var sub_chaine = chaine.substring( 2, 4 ); // affiche le résultat alert ( sub_chaine );
N'hésitez pas à tester avec plusieurs valeurs pour voir le comportement de la fonction.
Un seul exemple semble léger pour voir les capacités de cette fonction.
Nous allons tester certains exemples "limites" pour voir comment le Javascript réagit :
// initialisation d une variable var chaine = "coucou"; // tests en inversant les paramètres alert ( chaine.substring( 4,2 ) );
Comme vous pouvez encore le voir, le javascript est assez permissif, et permet ce genre de choses sans que cela ne le gène.
// initialisation d une variable var chaine = "coucou"; // en mettant des valeurs négatives alert ( chaine.substring( -4,-2 ) ); // en mettant des valeurs négatives et positives alert ( chaine.substring( -1,2 ) );
Le javascript exécute réellement ces commandes sans renvoyer d'erreur, il cherche bien les caractères avant l'index 0, mais n'en trouvant pas il retourne une chaîne vide. Dans le second exemple, on a en fait comme résultat l'équivalent de :
// initialisation d une variable var chaine = "coucou"; // affiche le résultat qui est le même qu avec les paramètres -1 et 2 alert ( chaine.substring( 0,2 ) );
Voyons maintenant comment utiliser de manière plus efficace les deux premières fonctions. On commence ici à chercher des astuces, certes simples mais qui sont en fait les prémices de l'apprentissage de la logique de la programmation.
Le but de l'exemple suivant est de découper le mot d'une manière simple et qui ne changera pas selon la longeur de la chaîne dans la variable. Nous allons découper une variable de la manière suivante : 3 lettres d'un coté, et tout le reste de l'autre.
// initialisation var welcome = 'Bonjour'; // récupération des 3 premières lettres var debut = welcome.substring( 0,3 ); // récupération de la longueur de la chaine var longueur = welcome.length; // récupération de la fin du texte var fin = welcome.substring ( 3, longueur ); // affichages alert ( 'Debut: ' + debut + '.' ); alert ( 'Fin: ' + fin + '.' );
1.3.3 Récupération d'un seul caractère
Il est possible de récupérer juste un caractère d'une chaîne, la fonction charAt prend en paramètre un numérique et renvoie donc le caractère voulu.
// initialisation var chaine = "Tests"; // on affiche le 4ème caractère alert ( chaine.charAt( 3 ) );
1.3.4 Recherche de caractère ou d'un bout de chaîne
La fonction indexOf permet de récupérer la position de la première occurrence d'une chaîne ou d'un caractère ( un caractère étant une courte chaîne ) dans une chaîne donnée. Cette fonction prend en paramètre la chaîne à rechercher et renvoie la position sous forme numérique.
// initialisation var chaine = 'Bonjour, ceci est une chaîne de test.'; // on cherche ceci var position = chaine.indexOf ('ceci'); // affichage alert ( 'La position de la chaine "ceci" est ' + position + '.');
On peut réécrire la même chose avec la chaîne "ceci" en tant que variable et sans passer par une variable intermédiaire.
// initialisation var chaine = 'Bonjour, ceci est une chaîne de test.'; var cherche = 'ceci'; // recherche et affichage alert ( 'La position de la chaine "' + cherche + '" est ' + chaine.indexOf ( cherche ) + '.');
Il est indispensable de bien comprendre comment marche l'imbrication des fonctions les unes dans les autres et l'ordre dans lesquel elles sont exécutées pour comprendre précisement le dernier exemple.
Comme la fonction indexOf cherche la première occurence, la fonction lastIndexOf cherche la dernière.
// initialisation d un chaîne qui comporte 2 fois la sous chaîne un var chaine = 'Ceci est un exemple sur une chaîne.'; var cherche = 'un'; // on affiche la première position alert ( 'La premiere position de la chaine "' + cherche + '" est ' + chaine.indexOf ( cherche ) + '.'); // on affiche la dernière position alert ( 'La derniere position de la chaine "' + cherche + '" est ' + chaine.lastIndexOf ( cherche ) + '.');
Comme vous pouvez le remarquer, les fonctions ci-dessus ne recherchent pas les chaînes en temps que mot, et bien en temps que morceau de chaîne, si l'on avait voulu chercher le mot "un", on aurait, par exemple, ajouter un espace devant et un espace derrière. Ces espaces prouveraient bien qu'il s'agit d'un mot en lui même.
// initialisation d un chaîne qui comporte 2 fois la sous chaîne un entourée d espace var chaine = 'Ceci est un exemple sur une chaine.'; var cherche = ' un '; // on affiche la première position alert ( 'La premiere position de la chaine "' + cherche + '" est ' + chaine.indexOf ( cherche ) + '.'); // on affiche la dernière position alert ( 'La derniere position de la chaine "' + cherche + '" est ' + chaine.lastIndexOf ( cherche ) + '.');
Les chaînes " un " trouvées ici sont deux fois les mêmes puisqu'une seule occurence de " un " se trouve dans la phrase, en partant du début ou de la fin, on tombe forcément sur la même occurence.
Bien sûr, cette technique a aussi ses limites, puisque si le mot que l'on recherche est en début de phrase, il n'y a aucun espace avant le premier mot de chaque phrase. De même si le mot est proche d'un caractère de ponctuation, l'espace de fin serait de trop. Pour résoudre ce genre de problème, une bonne réflexion sera nécessire pour exactement évaluer les parties à rechercher.
1.3.5 Conversion majuscule/minuscule
Sur les chaînes nous avons la possibilité de passer tout les caractères en majuscule ou minuscule. Ces fonctions sont principalement utilisées pour améliorer l'affichage des phrases.
Les fonctions toUpperCase ( en majuscule ) et toLowerCase ( en minuscule ) ne prennent pas de paramètre et renvoient une chaîne de caractères.
// initialisation d une chaine avec majuscules et minuscules. var chaine = "TeXt"; // transformation du texte en minuscule et affichage de celui-ci alert ( chaine.toLowerCase() ); // transformation du texte en majuscule et affichage de celui-ci alert ( chaine.toUpperCase() );
Par exemple, pour respecter la syntaxe d'une phrase, on peut faire une petite fonction qui renvoie la chaîne qu'on lui donne avec tous les caractères en minuscule exceptée la première lettre.
// la fonction qui calcule la phrase function enPhrase ( str ) {// calcule la phrase str = str.substring(0,1).toUpperCase() + str.substring(1,str.length).toLowerCase(); // revoie la phrase calculee return str;} // initialisation var chaine = "ceci EST une PHRASE."; // utilisation de la fonction chaine = enPhrase( chaine ); alert ( chaine );
Ce petit aperçu de l'utilisation des objets chaînes de caractères est terminé. Beaucoup d'autres fonctions et propriétés sont disponibles. Vous êtes désormais capables de les tester et d'imaginer à quoi elles pourraient vous servir.
2. Utilisation des listes
2.1 L'initialisation et la lecture des éléments d'une liste.
Les listes sont très utilisées en programmation, elles permettent de stocker plusieurs valeurs liées dans une seule variable. Ces listes sont appelées "array" en anglais. Pour initialiser une liste il y a plusieurs possibilités, la manière la plus simple :
// initialisation d une liste vide var liste = [ ]; // initialisation d une liste avec 4 éléments var liste2 = [ 1, 2, 3, 4 ]; // on affiche la seconde liste alert ( liste2 );
Il est possible aussi d'initialiser une liste de manière objet, qui serait normalement la manière standard.
//initialisation var liste = new Array(); var liste2 = new Array(1,2,3,4); // on affiche la seconde liste alert ( liste2 );
L'intérêt des listes donc, est de pouvoir stocker plusieurs valeurs, il est bien souvent plus pratique de récupérer les valeurs indépendamment les unes des autres. Lorsque l'on crée une liste la première valeur est à l'index 0 dans la liste.
Pour récupérer une seule valeur :
// initialisation d une variable qui contient quelques valeurs var liste = [ 1, 2, 3, 4, 5 ]; // on affiche la premiere valeur alert ( liste[0] ); // on affiche la troisieme alert ( liste[2] ); // on affiche une valeur qui n existe pas // vous obtiendrez une erreur javascript alert ( liste[6] );
2.2 Les opérations
Comme on peut lire les valeurs de manière indépendante, on peut aussi attribuer ou modifier des valeurs.
// initialisation var list = [ 1, 2, 3, 4, 5]; // modification d une valeur list[ 1 ] = list[ 1 ] + 4; // afficher la nouvelle valeur alert ( 'La nouvelle valeur de l element 1 est ' + list[1] + '.' ); // modification de la meme manière d une autre valeur list[ 2 ] += -5; alert ( 'La nouvelle valeur de l element 2 est ' + list[2] + '.' ); // une autre modification incluant deux valeurs de la liste: // on fait la multiplication des 2 dernieres valeurs qui est conservee dans l element 3 list[ 3 ] *= list[ 4 ] ; alert ( 'La nouvelle valeur de l element 3 est ' + list[3] + '.' ); // on ajoute une valeur pour un nouvel element list[ 12 ] = 6; alert ( 'Le nouvel element est bien cree et a comme valeur : ' + list[ 12 ] + '.' ); // la liste possède maintenant 13 elements // avec des indexs allant de 0 a 12 // aucune valeur n a ete attribuee pour les indexs 6 a 11 // on affiche la liste au complet : alert ( 'La liste a maintenant comme valeur : [' + list + '].');
Vous pouvez voir tout les élements vides de la liste lorsque l'on crée un nouvel élement dont l'index est éloigné des élements existants.
Ceci est encore un exemple de la permissivité du javascript, on peut jouer avec les listes très librement.
On peut commencer à voir avec les listes des utilisations pratiques de la programmation, même si cela reste simple, il manquera un coté fonctionnel que l'on vera par la suite.
Mettons nous dans le contexte suivant :
Quatre joueurs qui veulent garder leurs scores avec un petit programme. On utilisera une liste pour stocker les scores, chaque joueur ayant un élément de la liste.
// fonction qui met a jour un des scores function majScores ( scores, joueur, point ) {// mise a jour de la liste scores a la position du joueur scores [ joueur ] += point; // renvoie la liste mise a jour return scores;} // fonction qui affiche les scores function afficheScores ( scores ) {// j affiche le score du joueur pierre alert ( 'Le score de Pierre est : ' + scores[pierre] + '.' ); // j affiche le score du joueur Jean alert ( 'Le score de Jean est : ' + scores[pierre] + '.' ) // j affiche le score du joueur Marie alert ( 'Le score de Marie est : ' + scores[marie] + '.' ) // j affiche le score du joueur Julie alert ( 'Le score de Julie est : ' + scores[julie] + '.' )} /* initialisation d un index des joueurs on utilise leurs noms comme noms de variables pour plus de facilité, la valeurs de ces variables ne changeront pas, on met donc des variables globales */ pierre = 0; jean = 1; marie = 2; julie = 3; // initialisation de la liste des scores var scores = [ 0, 0, 0, 0 ]; //les traitements // jean marque 1 point majScores ( scores, jean, 1 ); // julie marque 3 points majScores ( scores, julie, 3 ); // marie marque 2 points majScores ( scores, marie, 2 ); // jean marque de nouveau des points majScores ( scores, jean, 4 ); // affichage des scores a la fin afficheScores ( scores );
Les chaînes prennent le pas sur les listes, ainsi une chaîne additionnée à une liste, reste une chaîne et une liste additionnée à une chaîne devient une chaîne. Cette possibilité, vous l'avez en fait déjà vu lors de l'affichage d'une liste :
// initialisation var list = [ 1, 2, 3, 4, 5]; // on affiche la liste alert ( 'La liste a maintenant comme valeur : [' + list + '].');
L'alerte concatène tout ce qu'on lui passe en paramètre pour en faire une chaîne complète.
Voyons ici un exemple original :
// initialisation var list = ['un message de bienvenue', ' bonjour comment ca va?']; var message = 'Ceci est ' + list; // affichage du message alert ( message );
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 numériques var list_num = [ 4, 7, 1, 3, 2, 6 ]; // affiche la liste triée 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 chaînes 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.
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 :
| 0 | 1 | |
| 0 | 2 | 4 |
| 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.
3 Exercices
Dans cette seconde partie, les exercices seront moins simples mais vous serez quand même largement guidé. Cependant, ils restent tous faisables avec vos connaissances actuelles, c'est un travail de réflexion sur l'utilisation de ces connaissances qui vous est principalement demandé.
Comme d'habitude, les solutions fournies ne sont pas les seules solutions possibles pour finir les exercices. Si votre solution marche ( et c'est le pricinpal ), veuillez juste à comparer les solutions pour être sûr que votre solution fonctionne réellement.
3.1 Exercice 1
Réécrire le morceau de code du dernier exemple de la partie 1.3.2 sans utiliser la variable intermédiaire "longueur" pour le calcul de la variable "fin".
3.2 Exercice 2
Ecrire une fonction qui affiche la concaténation de deux chaînes données en paramètre ainsi que le nombre de caractères total ( la fonction ne retourne rien ). Les affichages seront fait de manière "smart" au fur et à mesure dans la fonction.
3.3 Exercice 3
Ecrire une fonction qui prend en paramètres 3 valeurs, et qui attribue dans la liste ( 1er paramètre ), dans une position donnée ( 2nd paramètre ), une valeur donnée ( 3eme paramètre ) et qui retourne la liste. On écrira quelques lignes de code supplémentaires pour tester la fonction.
3.4 Exercice 4
Ecrire une fonction qui cherche dans le paramètre 2, une occurence du paramètre 1, et retourne tous les caractères avant la position du text du paramètre 2 en minuscule et tous les autres en majuscule dans la même variable.
Initialiser une variable string à "chaine" et autre une chaîne à la valeur "Pour realiser cet exercice, nous avons besoin d'une longue chaine de caractere." et passer ces chaînes en paramètre à votre fonction. Un affichage final pour vérifier le bon fonctionnement sera le bienvenu.
3.5 Exercice 5
Cet exercice est particulier, vous devrez corriger la fonction ci-dessous, vous serez obligé d'en comprendre le fonctionnement avec les commentaires donnés et d'écrire les quelques lignes de codes pour tester la fonction.
// la fonction à corriger function additionne ( liste1, liste2 ) {// j additionne les premiers éléments liste1[ 0 ] += liste[ 0 ]; // j additionne les seconds éléments liste2[ 1 ] += liste2[ 0 ]; // j additionne les derniers éléments liste1[ 2 ] += liste2[ 2 ]; // je retourne la liste modifiée return liste1;}
(Pour faire les exercices qui suivent il faut avoir suivi le chapitre : 2.4 L'évolution des listes)
3.6 Exercice 6
Le but de cet exercice est d'écrire l'initialisation d'une variable (globale) contenant les pions placés sur une grille d'un jeu d'une taille de 4 cases en largeur par 3 cases en hauteur. Chaque élément sera initialisé à 0.
3.7 Exercice 7
Suite de l'exercice précédent.
Ecrire une fonction qui permet de remplir la matrice case à case. Cette fonction prendra en paramètre, les coordonnées de l'élément à modifier ainsi que la nouvelle valeur à attribuer. Vous écrirez aussi une fonction pour afficher un élément de la matrice.
Vous écrirez des lignes supplémentaires appelant cette fonction ainsi qu'un affichage pour vérifier le bon fonctionnement de votre fonction.
4 Conclusion
Nous n'avons vu que deux objets dans cette seconde partie de l'article. Ces deux objets seront extrémement utilisés par la suite, il faut donc avoir assimilé la majeure partie de ce que l'on a vu, de plus les matrices ont apporté les premières réelles difficultés de compréhension.
Dans la prochaine partie, les premiers tests et les premières boucles de programmations seront abordés, on pourra ainsi commencer à aborder les premiers aspects intéressants, voir amusants de la programmation.
5 Vos questions/Mes Réponses
Si vous avez des problèmes ou des incompréhensions n'hésitez pas à m'envoyer un mail, j'ajouterai ici les questions intéressantes et modifierai l'article en conséquense pour plus de clarté.
6 Solutions des exercices
7.1 Exercice 1
// initialisation var welcome = 'Bonjour'; // découpage de la variable dans deux autres // recuperation des 3 premières lettres var debut = welcome.substring( 0,3 ); // recuperation de la fin du texte var fin = welcome.substring ( 3, welcome.length ); // affichages alert ( 'Debut: ' + debut + '.' ); alert ( 'Fin: ' + fin + '.' );
7.2 Exercice 2
// la fonction principale function concat( chaine1, chaine2 ) {var longue_chaine = chaine1 + chaine2; alert ( 'La chaine resultante est : ' + longue_chaine + '.' ); alert ( 'La longueur est longue de ' + longue_chaine.length + ' caracteres.');} // quelques lignes de code supplémentaires pour tester la fonction // initialisation de 2 chaines var ch1 = 'Construction de '; var ch2 = 'la phrase.'; // appel de la fonction concat( ch1, ch2 );
7.3 Exercice 3
// la fonction qui modifie la liste function modifieUneListe( liste, index, valeur ) {// on modifie la liste liste[ index ] = valeur; // on renvoie la liste return liste;} // initialisation de la liste et des valeurs de test var maliste = [ 4, 7, 9, 12 ]; var monindex = 2; var mavaleur = 16; // modification maliste = modifieUneListe ( maliste, monindex, mavaleur ); // affichage du resultat alert ( 'La liste modifiee est : ' + maliste + '.' );
7.4 Exercice 4
// la fonction qui recherche et revoie la chaine modifiee function rechercheDeChaine( ch1, ch2 ) {// on trouve la position var trouve = ch2.indexOf ( ch1 ); // On renvoie la solution. // Il est possible, voir fort probable, que vous ayez decompose en // 4 a 5 instructions distinctes. return ( ch2.substring( 0, trouve ).toLowerCase() + ch2.substring( trouve, ch2.length ).toUpperCase() );} // initialisation des chaines var chaine1 = 'chaine'; var chaine2 = 'Pour realiser cet exercice, nous avons besoin d une longue chaine de caractere.'; // affichage de la transformation alert ( rechercheDeChaine ( chaine1, chaine2 ) );
7.5 Exercice 5
// la fonction a corriger function additionne ( liste1, liste2 ) {/* j additionne les premiers elements avec les bonnes listes */ liste1[ 0 ] += liste2[ 0 ]; /* j additionne les seconds elements. L erreur est ici une double erreur, ce n est pas la bonne liste qui est mise a jour, de plus ce n est pas le bon index pour la valeur additionnee. */ liste1[ 1 ] += liste2[ 1 ]; // j'additionne les derniers elements liste1[ 2 ] += liste2[ 2 ]; // je retourne la liste modifiee return liste1;} // lignes supplementaires // inititalisation de 2 listes de 3 elements chacune var liste1 = [ 1, 2, 3 ]; var liste2 = [ 2, 2, 2 ]; // affichage et lancement de la fonction alert ( additionne ( liste1, liste2 ) );
7.6 Exercice 6
// initialisation de la matrice
trinity = [];
trinity [ 0 ] = [ 0, 0, 0, 0];
trinity [ 1 ] = [ 0, 0, 0, 0];
trinity [ 2 ] = [ 0, 0, 0, 0];
7.7 Exercice 7
// fonction qui affiche la matrice function afficheUnElement ( matrice, ligne, colonne ) {/* on affiche le bon element, il faut bien faire attention a appeller les valeurs de ligne et colonne dans l'ordre*/ alert( matrice[ ligne ][ colonne ]); ;} // fonction qui edite la matrice function editerUneMatrice ( matrice, ligne, colonne, valeur ) {// on edite le bon element matrice[ ligne ][ colonne ] = valeur; return matrice;} // initialisation de la matrice trinity = []; trinity [ 0 ] = [ 0, 0, 0, 0]; trinity [ 1 ] = [ 0, 0, 0, 0]; trinity [ 2 ] = [ 0, 0, 0, 0]; // appel de la fonction qui met a jour la matrice trinity = editerUneMatrice ( trinity, 1, 2, 4 ); // appel de la fonction qui affiche l element voulu afficheUnElement ( trinity, 1, 2 );
