Mapa JavaScript

W tym artykule nauczymy się jednej z najczęściej stosowanych metod dla tablicy, czyli Metoda map (). Metoda MAP pomaga w mapowaniu tablic zgodnie z naszymi wymaganiami. Zobaczmy, jaka jest metoda map ()? Jaka jest składnia do mapowania tablic za pomocą metody map ()?

Tablica Metoda map służy do konstruowania nowej mapowanej tablicy na podstawie wartości zwrotnej funkcji zwrotnej dla każdego elementu.

var mapedArray = tablica.mapa (funkcja callback, ta wartość)

oddzwonić to funkcja, która będzie wywoływana za każdym razem dla jednego elementu i zwraca wartość, która będzie przechowywana w nowej tablicy. Składnia funkcji zwrotnej jest

funkcja (wartość, [indeks [, tablica]])

wartość jest niezbędnym argumentem, który jest w rzeczywistości pojedynczym elementem tablicy.
indeks jest opcjonalnym argumentem, który będzie używany jako indeks każdego elementu w funkcji zwrotnej.
szyk jest również opcjonalnym argumentem. Możemy przekazać ten argument, jeśli chcemy użyć tablicy w funkcji oddzwaniania.

ta wartość to wartość, którą chcemy przekazać, która będzie używana jako „to” w funkcji zwrotnej. W przeciwnym razie „niezdefiniowane” zostanie przekazane.

JavaScript zapewnia… W pętli i pętli i foreach do iteracji przez elementy i manipulowanie tablicami. Ale dlaczego oprócz tego potrzebujemy metody mapy? Istnieją dwa główne powody tego. Jednym z nich jest rozdzielenie troski, a druga to łatwa składnia do wykonywania takich zadań. Wypróbujmy kilka różnych przykładów, aby zademonstrować cel i właściwe użycie.

Przykłady

Po pierwsze, będziemy mieli prostą demonstrację, w której mamy prostą gamę liczb, na których spróbujemy wykonać dowolną prostą operację arytmetyczną na każdym elemencie.

var arr = [4, 8, 16, 64, 49];

Teraz przed zastosowaniem metody mapy w tej tablicy. Najpierw napiszemy funkcję wywołania zwrotnego, do której możemy wywołać naszą funkcję mapy, w której, powiedzmy, że chcemy pomnożyć każdy element z 10 i mieć nową tablicę.

Funkcja pomnóż (element)
var newelement = element * 10;
Przywróć newelement;

Wszystko jest skonfigurowane w celu zastosowania metody mapy w tablicy i wymaganych wyników.

var newarr = ARR.mapa (pomnóż);

Teraz, jeśli spojrzymy na „Newarr”,

konsola.log (Newarr);

Możemy zobaczyć najnowszą mapowaną tablicę w wyniku zgodnie z naszymi wymaganiami.

Pamiętaj o tym, że długość nowej mapowanej tablicy z pewnością będzie równa oryginalnej tablicy.

Istnieje krótszy sposób wykonywania tego samego zadania za pomocą strzałki lub funkcji anonimowej w metodzie mapy. Możemy więc napisać funkcję wywołania zwrotnego w takiej metodzie mapy

var newarr = ARR.map ((element) =>
Element powrotny * 10
)

Lub, jeśli chcemy być profesjonalistą i sprawić, że będzie bardziej zwięzły. Możemy to zrobić

var newarr = ARR.Mapa (e => e * 10)

W porządku! Tak więc była to bardzo podstawowa demonstracja metody mapy i różne sposoby pisania funkcji odwołania. Ale ta funkcja jest bardziej przydatna, gdy bawimy się szeregiem obiektów. To właśnie dzieje się prawdziwa wdrożenie.

Za pomocą mapy z szeregiem obiektów

W tym przykładzie przypuszczamy, że tablica obiektów, w których każdy obiekt zawiera informacje od gracza. Imię gracza i jego identyfikator.

var arr = [
Id: 12, nazwa: „James”,
Id: 36, nazwa: „Morgan”,
Id: 66, nazwa: „Jordan”
];

Powiedzmy teraz, że chcemy wyodrębnić identyfikatory z każdego obiektu i mieć nową gamę identyfikatorów.
Ale, aby zrozumieć, jak metoda mapa jest inna i pomaga lepiej niż pętla foreach. Spróbujemy obu z nich (metoda map i pętla foreach), aby wykonać to samo zadanie i poznać różnicę.

Najpierw spróbujemy wyodrębnić IDS za pomocą pętli foreach, a następnie za pomocą metody mapy.

var ekstraktEdids = [];
arr.foreach ((element) =>
Zwrot ekstrakcji.push (element.ID);
)

Teraz, jeśli spojrzymy na wyodrębnione identyfikatory.

konsola.log (ekstrahowaniedids);

Mamy je oddzielone w tablicy. Ale teraz zademonstrujmy to samo wyjście przy użyciu metody mapy.

var ekstraktedids = ARR.map ((element) =>
element powrotu.ID;
)
konsola.log (ekstrahowaniedids);

Patrząc na różnicę w kodzie i tym samym wyjściu, możemy zrealizować prawdziwą różnicę między dwiema metodami (foreach i mapa). Składnia i rozdzielenie troski.

Podobnie możemy wykonywać wiele innych operacji. Jeśli musimy grać i uzyskać dane z tablicy obiektów. Przypuszczamy, że tablica obiektów, w których każdy obiekt zawiera dwie właściwości: imię i nazwisko.

var arr = [
FirstName: „John”, LastName: „Doe”,
FirstName: „Morgan”, LastName: „Freeman”,
FirstName: „Jordan”, LastName: „Peterson”
];

Teraz chcemy mieć tablicę zawierającą pełne nazwiska. Więc napiszemy taką funkcję mapy, aby spełnić nasz cel

var FullName = ARR.mapa ((osoba) =>
osoba powracająca.FirstName + " + osoba.nazwisko
)
konsola.log (pełna nazwa);

Jak widać, mamy osobną tablicę z pełnymi nazwiskami. To wspaniale.

Tak więc są to niektóre z podstawowych i różnych sposobów wykorzystania funkcji mapy do spełnienia naszych wymagań programistycznych i pomaga w życiu każdego programisty JavaScript.

Wniosek

W tym artykule dowiedzieliśmy się o najczęściej używanej metodzie Map () JavaScript dla tablic i nauczyliśmy się różnych sposobów korzystania z metody mapy. W tym artykule wyjaśniono pojęcie metody mapy w tak łatwy i głęboki sposób, że każdy początkujący koder może ją zrozumieć i wykorzystać swoje potrzeby. Więc nauczaj się, pracuj i uzyskaj doświadczenie w JavaScript z Linuxhint.com, aby lepiej nad tym zrozumieć. Bardzo dziękuję!