.forEach(), .map(), .filter() … Quelle différence ?
.forEach() exécute le même code sur chaque élément d’un tableau mais ne modifie pas de données dans le tableau et retourne undefined. On boucle donc sur le tableau mais il n’y a pas à stocker le résultat dans une variable.
.map() exécute le même code sur chaque élément d’un tableau et retourne un array avec les données modifiées. C’est bien un nouveau tableau qui est retourné et pas le tableau d’origine qui est modifié. On boucle sur le tableau et il faut stocker le résultat dans une variable.
.filter() test chaque élément d’un tableau pour voir s’il répond à une condition (ou plusieurs) et retourne un nouveau tableau avec les éléments ayant retournés true à la condition. Il faut donc stocker le résultat dans une nouvelle variable, qui sera de type array.
.some() vérifie si au moins une valeur du tableau valide un test codé dans une fonction et retourne un booléen.
.every() test si tous les éléments du tableau valident un test codé dans une fonction et retourne un booléen.
.includes() vérifie si un tableau contient une valeur spécifique et retourne un booléen.
Exemple d’utilisation de filter()
const keywords = ['développement', 'PHP', 'JS', 'HTML', 'programmation', 'CSS']; let words = keywords.filter(keyword => keyword.length < 5); // La variable words contient le tableau ['PHP', 'JS', 'HTML', 'CSS']
Instanciation
Pour instancier un tableau on peut soit indiquer simplement des crochets vides soit l’instancier avec des valeurs dès le départ.
// Tableau vide var array1 = []; var array2 = new Array(); // Tableau avec données var array1 = [1, 2, 3]; var array2 = new Array(1, 2, 3);
Fonctions des tableaux
// Ajoute un élément à la fin du tableau
arr.push(val);
// Ajoute deux éléments à la fin du tableau
arr.push(val1, vale2);
// Ajoute un élément au début du tableau
arr.unshift(val);
// Ajoute deux éléments au début du tableau
arr.unshift(val1, val2);
// Supprimer le dernier élément du tableau
arr.pop();
// Supprime le premier élément du tableau
arr.shift();
// Conserve les éléments à partir de la 2ème position
arr.slice(2);
// Conserve les éléments de la position 3 à la position 4
arr.slice(2, 4);
// Conserve les éléments jusqu'à l'avant dernière position
arr.slice(-2);
// Concatène chaque élément du tableau dans une chaine de caractères en les séparant par une valeur, ici un tiret
arr.join("-");
// Concaténation de deux tableaux
var arr = arr1.concat(arr2);
// Inverse le tri du tableau
arr.reverse();
// Tri par ordre alphabétique les éléments du tableau
arr.sort();
// Tri les éléments du tableau selon la fonction de comparaison en paramètre
arr.sort(function() {
});
// Vérifie si une valeur est dans un tableau
const values = ['vert', 'jaune', 'rouge'];
console.log(values.includes('orange')): // Affiche false
// Retourne l'index de la 1ère valeur qui correspond, -1 si valeur non trouvée.
const values = ['vert', 'jaune', 'rouge'];
console.log(values.indexOf('orange')): // Affiche -1
console.log(values.indexOf('rouge')): // Affiche 2
// Retourne l'index de la dernière valeur qui correspond, -1 si valeur non trouvée.
console.log(values.lastIndexOf('rouge'));
// Retroune les clés
values.keys();Pour connaitre la taille d’un table (le nombre d’éléments qu’il contient) on écrit arr.length. Cela peut permettre également d’accéder à une valeur préciser via sa position, par exemple, le dernier élément via arr[arr.length-1].