Et voici un concept essentiel en JavaScript, il s’agit de l’utilisation des tableaux.
Découvrez toutes les possibilités des tableaux (ou array) avec JavaScript.
Le cours vidéo, ci-dessous, vous explique tout dans le détail.
[ppmaccordion][ppmtoggle title= »Afficher le texte de la vidéo »]
Les tableaux JavaScript array n’auront plus de secret pour vous
Bonjour à tous et bienvenu sur Développement Facile.
On continu, vous allez continuer à découvrir les objets les plus importants avec JavaScript, rappelez-vous les cours précédents vous avez découvert l’objet string, très utilisé, l’objet date également très utilisé, et le nouvel objet que vous allez apprendre à utiliser aujourd’hui, il s’affiche sur votre écran, il s’agit de l’objet Array. Les tableaux qui sont très utilisés, que ce soit en C, en Java, en PHP, également en JavaScript c’est également très utilisé.
Objet Array
Alors comment ça marche ? Pour gérer les données, on utilise un tableau, donc on définit var tableau égal, vous définissez les différentes valeurs, valeur 1, valeur 2, valeur 3, valeur 4, var semaine égal new array lundi, mardi, mercredi, jeudi, vendredi, samedi, dimanche, et pour accéder à un élément, entre crochets document.write, donc semaine[3], non ça ne va pas afficher l’élément numéro 3, tous les débutants font cette erreur, je l’ai faite aussi, en fait les tableaux, ça part de l’indice 0, donc si vous faites semaine[0], ça va afficher lundi, donc lundi 0, mardi 1, mercredi 2, jeudi 3, donc a semaine de 3 ça va afficher le jeudi, rappelez-vous les tableaux démarrent à l’indice zéro pour le premier élément. semaine.length ça va vous renvoyer le nombre d’éléments présents dans le tableau.
Voici les méthodes disponibles dans les tableaux,
concat vous avez deux tableaux différents vous faites un tableau.concat tableau 2 en argument ça va vous renvoyer un nouveau tableau assemblé,
join ça créé une chaîne de caractères à partir des éléments d’un tableau donc vous avez une méthode pour, à partir d’une chaîne de caractères slip créer une tableau, vous avez l’inverse, à partir d’un tableau créer une chaine de caractères,
shift ça supprime le premier élément d’un tableau si vous souhaitez, souvent un tableau ça a des données et un tableau ça vie au court de l’exécution de votre site JavaScript, donc vous pouvez supprimer l’élément d’un tableau avec shift, le premier,
pop ça va supprimer le dernier élément d’un tableau donc c’est en fonction de votre algorithme,
unshift ça va ajouter un élément au début de votre tableau,
push ça va ajouter un élément à la fin de votre tableau, pardon,
slice c’est un retour d’une partie d’un tableau, ce sont des méthodes que vous allez utiliser tout le temps, très important il faut les savoir par cœur, faites comme moi, vous avez une note, un fichier, moi j’ai un cours, qui font office de mémoire.
splice ça ajoute, supprime, remplace, les éléments d’un tableau,
toString vous connaissez, vous le voyez, il est présent dans tous les objets toString, ça converti un tableau en chaîne de caractères,
reverse ça inverse l’ordre des éléments dans un tableau,
valueOf ça retourne un élément que vous avez choisi, d’un tableau,
sort ça permet de trier les éléments d’un tableau, par ordre croissant, décroissant, alphabétique, alphanumérique, comme vous le souhaitez avec sort vous pouvez trier les éléments de votre tableau.
Là ça va utiliser la méthode concat ça affiche le contenu d’un assemblage de deux tableaux, vous avez var tableau debut qui contient lundi, mardi, mercredi, var tableauFin qui contient jeudi, vendredi, samedi, dimanche, et pour avoir votre tableau semaine, vous faites debut.concat(fin), vous faites un document.write(semaine) ça vous fera lundi, mardi, mercredi, jeudi, vendredi, samedi, dimanche les sept jours de la semaine dans le même tableau.
Alors un autre exemple, là c’est pour afficher les deux premiers jours d’une semaine de travail, et les deux dernier jours d’une semaine de travail, vous avez un tableau qui contient tous les jours de la semaine, aSemaine =[ « lundi », « mardi », « mercredi », « jeudi », « vendredi », « samedi », « dimanche »], la partie un, aSemaine on fait un split, on récupère à partir de l’élément 0, lundi deux éléments, donc lundi et mardi, et on supprime les deux premiers éléments du tableau de la semaine, ça les enlèvent complètement, ça enlève lundi et mardi, ça fait que mercredi vient à la position zéro du tableau a semaine, donc pour récupérer la deuxième partie et afficher les derniers jours de la semaine, il faut faire aSemaine splice mercredi à la position zéro, jeudi à la position un, donc splice un on prend deux éléments, jeudi et vendredi, donc un document.write, les deux premiers jours de la semaine, s partie 1, lundi, mardi, grâce à slice qui a enlevé les deux premiers éléments, et document.write les deux derniers jours la semaine, s partie 2, on a décalé mercredi à l’indice zéro donc, un pour jeudi, et vendredi, simplement, donc splice peut être très pratique comme méthode également, vous avez un exemple concret.
Alors pour ajouter des éléments dans un tableau, vous avez deux solutions, là on va rajouter un élément au début du tableau, vous avez votre tableau semaine, mardi, mercredi, jeudi, vendredi, samedi, dimanche vous avez remarqué qu’il manque lundi, vous faites un semaine a, il y a une erreur var semaine c’est pas semainier.unshift pour ajouter le lundi, c’est semaine.unshift pour ajouter le lundi au début du tableau, vous l’ajoutez votre lundi, donc document.write complète a semaine. Donc unshift ça ajoute un élément au début de votre tableau.
Votre plan d’actions !
Il faut savoir que les tableaux sont très utiles et très utilisés, dans tous les langages que ce soit le C, l’ActionScript, le PHP et le JavaScript, pour stocker des données, manipuler des données, classer, trier des données, donc ce cours est fondamental pour que vous puissiez progresser dans votre développement JavaScript. Retrouvez un exemple de code source sous ce cours vidéo, si vous avez des questions, posez-les moi directement sous ce cours vidéo et je vous dis à très bientôt sur Développement Facile.
[/ppmtoggle][/ppmaccordion]
Téléchargez le code source JavaScript
Voici un exemple de code source JavaScript avec des tableaux.
Téléchargement du code source Code source JavaScript avec array
