Iteruj elementy tablicy za pomocą .Metoda map w JavaScript

JavaScript jest jednym z najbardziej znanych języków skrypowych, które oferują tablice do przechowywania różnych elementów pod tym samym nazwą. Istnieją różne metody dostępne w JavaScript, przez które możemy iterować na przykład nad tablicami Do pętla, chwila pętla, dla każdego Metoda i wiele więcej, ale najczęstszym spośród tych wszystkich jest mapa() metoda.

Ten zapis wyjaśnia, jak iterować za pomocą elementów tablicy za pomocą .mapa() Metoda w JavaScript.

Jaka jest metoda map ()?

mapa() Metoda jest wbudowaną metodą tablicy, która iteruje tablicę i wykonuje funkcję na każdym elemencie w tablicy.

• Oryginalna tablica pozostaje taka sama, jak ta funkcja zwraca nową tablicę o tej samej długości.
• Należy również zauważyć, że mapa() Metoda nie wykonuje dla pustej tablicy.

Składnia metody map ():

myarray.map ((wartość, indeks, array) =>
powrót;
);

Metoda MAP ma funkcję wywołania zwrotnego (asynchroniczny odpowiednik funkcji), która akceptuje trzy parametry:

• Wartość: Jest to bieżąca wartość lub element tablicy
• Indeks: Jest to bieżący indeks elementu tablicy, na którym wykonywa się funkcja.
• Szyk: To tablica docelowa.

Przykład 1

W tym przykładzie będziemy iterować tablicę, mnożąc każdy element tablicy z 2:

// tablica
constMyNumbers = [4, 8, 9, 15, 20];
// pomnóż każdy element tablicy z 2
constMultipliedWithtwo = Mynumbers.map ((wartość) =>
Wartość zwracana*2;
);
// Wyświetl zwróconą tablicę
konsola.log (mnoveviedWithTwo);

W powyższym kodzie najpierw zainicjowaliśmy tablicę, a następnie zastosowaliśmy mapa() Metoda na oryginalnej tablicy. Wewnątrz funkcji zwróciliśmy wartość pomnożoną przez dwa. Należy zauważyć, że parametry indeksu i tablicy można pominąć, gdy nie chcesz ich używać. Wynikowa tablica jest przechowywana w mnożeniemtwo zmienna, a następnie wyświetliśmy tę zmienną za pomocą konsola.dziennik() metoda.

W powyższym wyjściu widzimy, że każdy element oryginalnej tablicy jest mnożony przez 2 i otrzymaliśmy pożądany wynik.

Gdy operacja wykonujesz na każdym elemencie, jest jednym wierszem kodu, a następnie prostszy i czystszy sposób wdrożenia mapa() Zastosowana jest metoda, która podano poniżej:

// tablica
constMyNumbers = [4, 8, 9, 15, 20];
// pomnóż każdy element tablicy z 2
constMultipliedWithtwo = Mynumbers.map ((wartość) => wartość*2);
// Wyświetl zwróconą tablicę
konsola.log (mnoveviedWithTwo);

Nie ma kręconych nawiasów i powrotu.

Wyjście jest nadal takie same, jak na powyższym zrzucie ekranu.

Przykład 2

Spójrzmy na kolejny przykład, w którym będzie się iterować przez szereg strun:

// tablica
constFirstNames = [„super”, „bat”, „pająk”, „żelazo”];
// Dodaj człowieka z każdym łańcuchem w tablicy
ConstheroEsnames = FirstNames.map ((wartość) => wartość+„man”);
// Wyświetl zwróconą tablicę
konsola.Log (Heroesnames);

W powyższym kodzie, po pierwsze, zainicjowaliśmy tablicę z imionami słynnych superbohaterów. Następnie zastosowaliśmy mapa() metoda w tej tablicy, w której połączyliśmy ciąg "Człowiek" z każdym elementem imiona szyk. W końcu wyświetliśmy zwróconą tablicę z mapa() Metoda przy użyciu konsoli.Metoda log ():

Widzimy to z każdym elementem Człowiek został połączony.

Wniosek

Iteracja nad tablicą JavaScript oferuje nam różnorodne techniki, w tym pętle i dla każdego() metoda. Jednak najsłynniejszą techniką iteracji jest mapa() metoda. mapa() Metoda wykonuje element każdej tablicy i zwraca świeżą tablicę, która ma długość dokładnie równą oryginalnej tablicy.

Ten post wyjaśnia, jak iterować za pomocą tablicy za pomocą mapa() Metoda w JavaScript wraz z dwoma przykładami.