Méthodes ES6
ES6, qui est la forme courte de ECMAScript 6, est la version de JavaScript qui a été publiée en juin 2015. Il semble que les développeurs qui maintiennent JavaScript aiment mon mois de naissance, car c’est à cette date que la plupart de leurs versions ont été publiées.
Si vous venez d’apprendre JavaScript, ES6 vous rendra la vie beaucoup plus facile. Il fournit non seulement des méthodes de tableau, mais aussi des choses comme la déstructuration, les fonctions flèches, une meilleure façon d’écrire du code orienté objet et modulaire, entre autres choses.
La plupart de ces méthodes de tableau ES6 prennent une fonction de rappel, et par conséquent, elles sont appelées méthodes de tableau d’ordre supérieur. Les fonctions flèches sont très courantes dans les fonctions d’ordre supérieur, car cela simplifie notre code
La méthode map
S’il y a une méthode de tableau ES6 que vous utiliserez presque tout le temps, c’est cette méthode. C’est ma meilleure méthode de tableau à la fois en JavaScript et en Python. Même si certains développeurs JavaScript ont essayé d’implémenter map avant ES6, la méthode standard map a été introduite en JavaScript dans ES6. Dans l’extrait de code ci-dessous, j’ai mis en œuvre la méthode map de trois façons :
- En utilisant des fonctions JavaScript ordinaires : Ici, j’ai passé deux arguments à la fonction, d’abord
item, qui est l’élément sur lequel je veux faire quelque chose, et un argument facultatif,index, qui est l’indice de chaque élément - En utilisant des fonctions flèches : J’ai également passé deux arguments comme dans le premier exemple, mais la fonction de rappel ici est une fonction flèche, ce qui rend le code beaucoup plus net.
- J’ai également utilisé des fonctions flèche, mais j’ai passé un seul argument – l’élément sur lequel je veux itérer. C’est utile si je n’ai pas besoin de l’index.
La méthode du filtre
La méthode filter est une autre méthode de tableau d’ordre supérieur que vous devriez utiliser aujourd’hui. Ce que filter fait est simple. Étant donné un tableau d’éléments, nous voulons retourner un nouveau tableau à partir du tableau initial, où une condition particulière est true. La fonction de rappel doit retourner un booléen, et l’élément qui obéit à la condition est ce qui sera dans le nouveau tableau.
La méthode reduce
C’est très bien, et je pense que c’est la plus difficile de toutes les méthodes que j’ai mentionnées jusqu’à présent. Ce que fait cette méthode est d’utiliser un callback particulier pour réduire le tableau. Par exemple, si je veux trouver la somme de tous les éléments d’un tableau ou le produit de tous les éléments d’un tableau, cette méthode est une belle méthode à utiliser, au lieu de boucler et d’incrémenter la somme ou le produit initial.
La méthode forEach
Cette méthode est similaire à la méthode map, mais dans ce cas, elle ne retourne pas un nouveau tableau. Il s’agit plutôt de la boucle régulière for en JavaScript mais d’une manière plus propre et plus avancée. Elle prend trois paramètres, comme vous le savez peut-être. Le premier est l’élément dans le tableau, le deuxième est l’index de l’élément (qui est facultatif), et le troisième est l’objet du tableau auquel appartient l’élément actuel.
Dans le bout de code ci-dessous, j’ai utilisé forEach pour manipuler le Document Object Model (DOM), ce qui est plutôt cool. Je peux mettre à jour le tableau, et les éléments de la liste rendus sur le DOM seront modifiés automatiquement.
La méthode concat
Il y a des cas où vous voudrez joindre ou fusionner deux ou plusieurs tableaux ensemble. Alors, cette fonction sera très pratique. L’appel de concat sur deux tableaux produit un nouveau tableau qui se compose des deux tableaux combinés.
Les méthodes every et some
Ces méthodes sont utiles si vous voulez savoir si tous les éléments d’un tableau passent une condition et si certains des éléments d’un tableau passent une condition, respectivement.
Les autres méthodes comprennent :
La méthode fill
Remplit chaque élément du tableau avec une valeur passée en paramètre : .fill(1) // .
La méthode entries
Ceci fait que le tableau se comporte comme un objet avec une paire clé-valeur, où la clé est l’index et la valeur est l’élément.
La méthode find
Cette méthode renvoie le premier élément d’un tableau qui passe un test. Elle prend une fonction de rappel, qui renvoie un booléen.
La méthode splice
Cette méthode prend un nombre infini de paramètres – les deux premiers étant l’indice où vous voulez commencer à insérer et à retirer des éléments et le nombre d’éléments que vous voulez retirer, respectivement – et les paramètres restants étant les éléments que vous voulez ajouter au tableau. Elle renvoie un tableau des éléments retirés et mute le tableau.
La méthode inverse
La méthode inverse inverse le tableau. Notez qu’elle le mute, c’est-à-dire qu’elle modifie le tableau au lieu d’en créer simplement la copie.
La méthode join
Cette méthode transforme un tableau en tableau en chaîne de caractères. Notez qu’elle ne mute pas le tableau – elle en crée simplement une copie. L’inverse de cette méthode est la méthode split, qui transforme une chaîne en un tableau. Elle prend une chaîne de caractères comme paramètre, qui est ce qui sera utilisé pour joindre chaque élément du tableau.
La méthode plate
La méthode flat est une nouvelle méthode qui a été ajoutée dans ES11 (ES11 a été créé en juin dernier). Cette méthode aplatit un tableau.
Disons que nous avons un tableau qui contient un tableau, et nous voulons trouver la somme et le produit de chaque élément des tableaux à l’intérieur du tableau. Ce que je veux dire, c’est que si j’ai un tableau qui est défini par , ], la somme devrait être 10 et le produit devrait être 24.
Une façon de procéder est de boucler à travers le tableau initial et de boucler à travers chaque élément et d’obtenir la somme et le produit.
Avec ES6, je peux boucler à travers le tableau initial et utiliser la méthode reduce pour obtenir la somme et le produit de chaque élément dans le tableau principal – en utilisant cela pour obtenir la somme totale et le produit. Mais avec le tableau flat, je peux mettre à plat le tableau principal, renvoyant ainsi un seul tableau contenant uniquement des nombres, et je peux utiliser la méthode reduce sur celui-ci.
La méthode flatMap
C’est la combinaison de flat et map. Elle mappe chaque élément du tableau à une fonction de rappel donnée puis aplatit le tableau résultant.
Disons que nous aimerions obtenir le carré de chaque élément d’un tableau non aplati, et que nous aimerions l’aplatir. Cette méthode va nous faciliter la vie. Dans la partie où j’ai utilisé la méthode flatMap dans l’extrait de code ci-dessous, elle prend un élément qui est un tableau, et j’ai retourné un nouveau tableau, qui est le carré des éléments. Et enfin, elle aplatit le tableau résultant.
.