Różnica między foreach a pętlą map w JavaScript

Różnica między foreach a pętlą map w JavaScript
JavaScript ma pakiet wbudowanych metod wykonywania różnych operacji matematycznych na elementach tablicy. mapa() I dla każdego() są dwiema metodami iternami nad elementami istniejącej tablicy. mapa() Metoda stosuje funkcję na każdym elemencie tablicy i zwraca nową tablicę, podczas gdy metoda foreach () również używa tej samej funkcji, ale zmienia elementy bieżącej tablicy.

W tym poście szczegółowo opisano metody map () i foeach () w celu różnicowania tych metod w JavaScript.

Jak działa metoda Foreach () w JavaScript?

dla każdego() Metoda jest stosowana do wykonywania operacji w elementach tablicy. Pozwala na wykonanie metody wywołania zwrotnego. dla każdego() Typ powrotu metody jest niezdefiniowany, ponieważ całkowicie zależy od funkcjonalności funkcji odwołania.

Jest to nowszy sposób na napisanie mniej kodu, który iterowuje tablicę. Składnia metody foreach () podano poniżej:

Składnia

szyk.foreach (funkcja (element, indeks, tablica), thisval)

Opis składni jest następujący:

  • funkcja (element, indeks, tablica): jest wymaganą funkcją do iterowania elementów tablicy.
  • element: Określa istniejący element tablicy.
  • indeks: Reprezentuje wskaźnik istniejącego elementu.
  • szyk: Określa nazwę tablicy, do której element należy do.
  • toval: reprezentuje tę wartość funkcji.

Przykład

Poniższy przykładowy kod jest dostosowywany do omówienia użycia dla każdego() Metoda w JavaScript.

Kod


Przykład używania foreach ()






Opis kodu jest następujący:

  • Tworzony jest tag, który zostanie użyty do wyświetlania tablicy.
  • Potem tablica A jest inicjowany z sześcioma elementami z 10 do 15.
  • Ponadto dla każdego() Metoda jest wykorzystywana do iteracji elementów tablicy .
  • Właściwość Innertext odzyska całą zawartość elementu „Div”.
  • Właściwość appendchild służy do dołączania elementów dziecięcych do elementu o identyfikatorze „ID1".

Wyjście

Zauważono, że elementy tablicy są wydrukowane na oknie przeglądarki.

Jak działa metoda Map () w JavaScript?

Metoda map () zwraca transformowane elementy w nowej tablicy, stosując funkcję wywołania zwrotnego do każdego elementu tablicy. Metoda jest niezmienna i może zmienić/naprzemiennie dane. Jest szybszy w porównaniu z metodą Foreach (). Zapewnia funkcje łańcuchowe; Użytkownicy mogą kojarzyć metody sort (), filtr () i redukuj () po zastosowaniu map () do tablic. Ponadto zwraca ten sam rozmiar co istniejąca tablica.

Składnia jest podana poniżej.

Składnia

szyk.map (funkcja (element, indeks, tablica), thisval)

Opis parametrów jest następujący:

  • funkcja (element, indeks, tablica): oznacza funkcję, którą należy zastosować na każdym elemencie tablicy.
  • element: Podaj bieżący element tablicy
  • indeks: reprezentuj indeks bieżącego elementu
  • szyk: Określ nazwę tablicy dla metody wywołania zwrotnego
  • toval: pokazuje bieżącą wartość funkcji.

Kod

konsola.log („Przykład używania map ()”)
const num = [10, 9, 8, 7, 6]
konsola.log (num.mapa (ele =>
ele * ele))

Opis kodu jest wymieniony tutaj.

  • Po pierwsze, wiadomość jest wyświetlana za pomocą "konsola.dziennik()" metoda.
  • Potem szyk jest zatrudniony z nazwą num w którym zdefiniowano pięć elementów.
  • Wreszcie mapa() Metoda służy do zwrócenia nowej tablicy, w której wszystkie jej elementy są ich wielokrotnościami.

Wyjście

Wynik kodu pokazuje, że mapa() Metoda zwraca wartości kwadratowe 10, 9, 8, 7, I 6 Do 100, 81, 64, 49, I 36.

Wniosek

Metody map () i foreach () używają funkcji do wykonywania iteracji nad elementami tablicy. W rezultacie metody map () tworzą tablicę, podczas gdy typ zwrotu Foreach (metoda 0 jest niezdefiniowana. W tym poście opisano szczegółowe wyjaśnienie metody map () i foreach () w celu odróżnienia tych dwóch metod iteracyjnych. Obie metody są używane do iteracji elementów tablicy, ale ich sposób pracy różni się, co można zrozumieć od powyższej treści pisanej.