Il s’agit d’un élément indispensable à connaitre en programmation (quelque soit le langage).
Découvrez l’utilisation des tableaux ou comment les tableaux peuvent vous servir à stocker et classer vos données !
Tout est dans le cours vidéos ci-dessous.
[ppmaccordion][ppmtoggle title= »Afficher le texte de la vidéo »]
Comment utiliser la classe Array en JavaScript, php,… ?
Bonjour à tous et bienvenu sur développement facile
Dans ce nouveau cours vous allez apprendre à utiliser la classe Array en JavaScript et en PHP. C’est une classe très importante, je vous l’ai dit, les tableaux c’est quelque chose dont on se sert très souvent en programmation.
HTML 5, JavaScript, PHP, CSS et MySQL
Un petit rappel HTML 5 en fait c’est une combinaison de JavaScript, PHP, CSS, MySQL.
À quoi ça sert JavaScript ?
Ca permet de rendre vos pages Web interactives. C’est à dire avec JavaScript, vous pouvez contrôler les formulaires, faire apparaître ou disparaître des menus, créer des fenêtres, adapter une page Web à une résolution d’écran, par exemple, le site qui s’affiche sur un ordinateur, sur un Smartphone, sur une tablette. Vous pouvez manipuler des éléments HTML, créer des animations et même des jeux combinés à JavaScript, avec le HTML 5 tout ça. JavaScript, PHP, CSS, MySQL.
PHP, MySQL ils fonctionnent ensembles, ça permet de stocker et d’ajouter des informations dynamiques sur une page Internet. Et CSS lui s’occupe de toute la mise en forme d’une page Web, d’un jeu, d’un jeu JavaScript ou autre.
Alors revenons, rappelez-vous les cours précédents, sur les principes de programmation. JavaScript possède quelques particularités, c’est l’utilisation, ensemble nous allons voir l’utilisation des types de données, les tableaux, les chaînes de caractères et les booléens avec JavaScript.
Les tableaux en JavaScript
Donc je vous encourage à revoir le cours sur les tableaux, en tout cas la création, l’ajout d’éléments et le parcours de plusieurs dimensions, et avec la syntaxe JavaScript, vous allez découvrir la classe Array, donc vous créez un nouveau tableau, qui contient différents éléments, comme d’habitude, vous avez une propriété length qui vous renvoie le nombre d’éléments dans le tableau, et ensuite, il ne vous reste plus qu’à parcourir votre tableau avec une boucle for et ça va vous permettre d’afficher les différents éléments du tableau. Rappelez-vous l’indexe d’un tableau, la première position d’un tableau c’est 0.
Faites attention c’est une erreur que font souvent les débutants, c’est à dires qu’ils oublient que le tableau commence à zéro et après il y a un décalage lorsqu’ils affichent le contenu de leur tableau.
Les méthodes de la classe Array
Vous avez différentes méthodes dans la classe Array. Donc ses méthodes splice, unshift, push, indexOf, elles sont disponibles avec la classe Array de JavaScript, elles existent aussi en ActionScript et elles existent sûrement dans d’autres langages de programmation et dont le votre sûrement.
Donc aSplice, ça permet de supprimer un élément d’un tableau, donc vous spécifiez au premier paramètre, l’indexe et ensuite le nombre d’éléments d’un tableau à supprimer. Donc vous pouvez supprimer 1, 2, 3, 4 ou 5 éléments d’un seul coup d’un tableau, à partir de la position index que vous choisissez ici.
Unshift, ça ajoute des éléments au début du tableau c’est-à-dire que là, vous allez ajouter l’élément orange au début de votre tableau.
Push, au contraire, ça va ajouter des éléments à la fin de votre tableau.
Et indexOf ça va vous permettre de connaître la position de l’élément que vous avez donné en paramètre, et si l’élément n’existe pas dans le tableau, ça vous retourne la valeur -1.
Il y a d’autres méthodes dans la classe Array, par exemple vous avez la possibilité de créer un nouveau tableau, c’est à dire vous créez un tableau qui contient ananas et mangue, et vous pouvez assembler ces deux tableaux, aFruits et aFruitsNouveau, cela va vous créer un nouveau tableau. Donc comme je vous le dis, la méthode concate ça assemble le contenu de deux tableaux et ça vous retourne un nouveau tableau, tout en sachant que le tableau de départ aFruits n’est pas modifié.
La méthode toString ça renvoi tous les éléments du tableau.
La méthode join ça renvoi une chaîne de caractère qui contient tous les éléments du tableau, et remarquez que vous pouvez ajouter un paramètre optionnel donc un séparateur, pour séparer par un tiret tous les éléments de votre tableau. Donc je vous le re-rappelle, un tableau commence à la position 0.
Les tableaux sont essentiels
Je vais vous montrer un exemple de code source, donc en JavaScript, avec, vous avez créé votre tableau aFruits qui contient différents fruits, vous voulez afficher le fruit à la position, de rappelez-vous 0, 1, et 2 donc ça va afficher banane, ensuite vous voulez parcourir votre tableau, afficher tous les éléments du tableau, vous voulez renvoyer votre tableau sous forme de chaîne de caractères, avec toString, là vous supprimez deux éléments dans le tableau à partir de la position 0, 1, 2 donc ces deux éléments et ensuite vous ajoutez au début de votre tableau orange à la fin de votre tableaux banane et vous pouvez concaténer deux tableau. Donc là c’est un exemple de code source en JavaScript, ça vous montre justement, comment utiliser la classe Array en JavaScript.
Comme je vous l’ai dit, la syntaxe est légèrement différente suivant le langage de programmation que vous utilisez que ce soit du Java, de l’ActionScript, dans le CSS encore un petit peu différent la gestion des tableaux. Et la classe Array simplifie énormément la manipulation des tableaux, sachez que l’Array n’existe pas en C, donc les tableaux sont très pratiques pour stocker et organiser des informations, parcourir une collection de données, par exemple.
A vous de jouer !
Donc là vous trouverez un exemple de code source directement sous ce cours vidéo, et je vous encourage comme d’habitude à utiliser les tableaux dans votre langage de programmation, parcourez des collections de données, manipulez des objets avec les tableaux, posez moi vos questions sous ce cours directement et je vous dis à très bientôt pour le prochain cours sur développement facile.
[/ppmtoggle][/ppmaccordion]
Téléchargez un exemple de code source
Retrouvez un exemple JavaScript avec les array / tableaux.
Téléchargement du code source Exemple de code source JavaScript pour Array.
