Comment mapper un tableau dans la méthode de carte du tableau JavaScript | Expliqué avec des exemples

Comme tout autre langage de programmation, JavaScript nous fournit divers types de données pour stocker des données. Un tel type de données est un tableau. Un tableau est un groupe d'éléments qui peuvent être utilisés pour stocker plusieurs valeurs en une seule variable. JavaScript nous propose des méthodes d'objets de tableau que nous pouvons utiliser pour gérer, organiser ou accéder aux données stockées dans les tableaux. Une telle méthode intégrée de l'objet de tableau est le carte() méthode.

Quelle est la méthode map ()?

La méthode MAP du tableau JavaScript crée un nouveau tableau en appelant une fonction de rappel (passant une fonction à une autre fonction comme argument) sur chaque élément sans modifier le tableau d'origine.

Le Syntaxe de la méthode de carte du tableau est illustré ci-dessous:

Myarr.map (fonction (currentValue, index, arr), thisValue);

Comme nous pouvons le voir dans la syntaxe ci-dessus, la méthode map () prend deux paramètres. Le premier est fonction (currentValue, index, arr) qui est une fonction de rappel et est un paramètre obligatoire. Cette fonction de rappel prend trois arguments. Le premier est le valeur actuelle se référant à la valeur actuelle de l'élément et c'est un paramètre obligatoire. Le deuxième paramètre est le indice qui a l'index de l'élément actuel et le troisième est le art qui fait référence au tableau. Les paramètres d'index et ARR sont facultatifs. Le paramètre suivant de la méthode map () est cette valeur qui fait référence à la valeur transmise à la fonction et ce paramètre VALUE est facultatif.

Itération sur un tableau en utilisant la méthode de la carte

Maintenant que nous savons ce qu'est une méthode de carte du tableau, voyons comment itérer sur un tableau en utilisant la méthode de la carte.

var myarr = [1,2,3,4];
var newarr = Myarr.map (fonction (élément)
// multiplier Myarr avec 2
// Renvoie un nouveau tableau
élément de retour * 2;
);
console.journal (newarr); // [2,4,6,8]

Dans le code ci-dessus, nous avons d'abord lancé un tableau avec le nom de Myarr puis appelé carte() Méthode sur ce tableau initiant une fonction de rappel. Dans la fonction de rappel, nous avons multiplié chaque élément de Myarr à 2. Nous avons ensuite enregistré le nouveau tableau au Newarr Variable puis enregistrez la console le nouveau tableau dont la sortie est indiquée ci-dessous:

Voyons quelques autres exemples de la méthode map () en javascript.

Éléments d'arrondi

Dans cet exemple, nous verrons comment nous pouvons arrondir les éléments de tableau à l'entier le plus proche.

var myarr = [2.3,3.7,4.4];
Var Output = Myarr.Carte (e => mathématiques.Round (e));
console.journal (sortie); // 2,4,4

Nous avons d'abord lancé un tableau avec le nom de Myarr puis a initié la méthode de carte sur ce tableau en arrondant chaque élément de Myarr puis la sortie de cette opération est enregistrée dans la variable sortir.

Trouver la racine carrée

Trouvez la racine carrée de tous les éléments d'un tableau pour lequel il est principalement le même que l'exemple ci-dessus. Tout d'abord, nous initierons un tableau puis exécuterons la méthode de carte dessus, en stockant le résultat dans la sortie.

var myarr = [4,9,16];
Var Output = Myarr.Carte (e => mathématiques.sqrt (e));
console.journal (sortie); // 2,3,4

Ajout de chaîne aux éléments du tableau

Dans cet exemple, nous ajouterons la chaîne 1 douzaine avec chaque élément du tableau. Par exemple:

var myarr = ["banane", "pomme", "orange"];
Var Output = Myarr.map (e => "1 douzaine" + e);
console.journal (sortie);

Nous pouvons voir dans la sortie que chaque élément du tableau a maintenant 1 douzaine dans le nouveau tableau qui est enregistré par console.

Obtenir le nom complet d'un tableau d'objets

Voyons un petit exemple complexe où nous lancerons un tableau d'objets qui contiendront le prénom et le nom de famille d'une personne. Nous allons ensuite exécuter la méthode map () sur ce tableau, puis dans la fonction de retour, nous concaterons le nom de premier et le nom de lastname pour obtenir un nom complet de la personne.

Const Persons = [
FirstName: "John", LastName: "Reynolds",
FirstName: "Smith", LastName: "Jhonson",
FirstName: "Sarah", LastName: "Frye"
]]
fonction getfullName (item)
retourner l'objet.FirstName, article.nom de famille].rejoindre(" ");

CONS OUTPUT = PERSONNES.map (getfullName);
console.journal (sortie);

Conclusion

Pour stocker des données JavaScript nous donne divers types de données tels qu'un tableau. Un tableau a des méthodes intégrées qui nous font facilement gérer notre code et écrire moins de code. Une de ces méthodes du tableau est la méthode map (). La méthode MAP () de tableau exécute une fonction de rappel sur chaque élément du tableau et renvoie un nouveau tableau.

Dans cet article, nous avons vu comment cartographier un tableau en javascript et quelle est une méthode de carte en javascript. En dehors de cela, nous avons itéré sur un tableau à l'aide de la méthode map (), puis avons fourni quelques exemples en utilisant la méthode map () du tableau pour transformer les éléments du tableau initié en fonction de la fonction de rappel fournie.