Jak iterować obiekty w JavaScript

Wiedza o tym, jak iterować za pośrednictwem wyliczalnego zestawu danych w JavaScript jest niezbędna dla początkujących JavaScript. Dane potrzebne do iteracji mogą znajdować się w dowolnej formie, takiej jak mapy, listy, tablice i obiekty. Różne metody JavaScript są wykorzystywane do iteracji przez obiekty w JavaScript i pobieranie wielu par kluczowych. Główne cztery z nich są Dla… w pętli, Obiekt.Klucze() metoda, Obiekt.wartości () metoda i Obiekt.wpisy () metoda.

W tym pismach omówi metody iteracji za pośrednictwem obiektów w JavaScript. Ponadto procedury związane z iteracją obiektów, takie jak… w pętli, obiekt.Metoda keys (), obiekt.wartości () metoda i obiekt.Metoda wpisów () zostanie również wykazana z przykładami. A więc zacznijmy!

Iterować obiekty w JavaScript, wykorzystując dla… w pętli

Jedną z najczęstszych metod iteracji właściwości obiektu jest użycie „dla w" pętla. Kod, który dodasz do… w pętli, zostanie wykonany raz dla każdej właściwości twojego obiektu.

Przykład: iterowanie obiektów w JavaScript poprzez wykorzystanie dla… w pętli

Najpierw musisz utworzyć obiekt w programie JavaScript. Na przykład, w poniższym przykładzie, stworzyliśmy „użytkownik„Obiekt o„nazwa”,„wiek”,„e-mail", I "aktywny”Jako jego właściwości:

const user =
Nazwa: „Jack Smith”,
Wiek: 28,
E -mail: '[email protected] ',
Active: True;

Następnie użyjemy „dla w„Pętla do iterowania poprzez stworzone użytkownik obiekt. „„dla w„Pętla zwróci właściwości lub klucze obiektu i ich wartości:

// iteruj za pośrednictwem obiektu użytkownika
dla (klucz const w użytkowniku)
konsola.log ('$ key: $ user [key]');

Oto pełny kod dostarczonego przykładu z jego wyjściem:

Iterować obiekty w JavaScript, używając obiektu.Metoda Keys ()

Aby ułatwić iterowanie przez obiekty, Obiekt.Klucze() Metodę dodano do ES6. Musisz przekazać obiekt, który chcesz iterować, i obiekt JavaScript.Metoda keys () zwróci tablicę zawierającą wszystkie klucze lub nazwy właściwości. Następnie możesz iterować tę tablicę i pobrać wartość każdej właściwości za pomocą metody zapętlania tablicy, takiej jak pętla JavaScript foreach ().

Przykład: iterowanie obiektów w JavaScript za pomocą obiektu.Metoda Keys ()

W celu demonstracji stworzymy „kursy„Obiekt posiadający różne kursy jako jego właściwości, takie jak„db”,„JavaScript”,„CP", I "dld”I przypisuje każdą z nich określone wartości:

const kursy =
DB: 45,
JavaScript: 67,
CP: 23,
DLD: 15;

Po tym przekonwertujemy „nasze”kursy”Obciekanie„Klucze"Tablica:

// Konwertuj obiekt na tablicę kluczy
const klawisz = obiekt.klucze (kursy);
// Wydrukuj wszystkie klucze
konsola.log (klucze);

W następnym kroku będziemy iterować za pomocą „kursy„Obiekt za pomocą„Klucze- tablica. Tutaj użyliśmy „dla każdego()„Pętla do iteracji:

// iteruj obiekt
Klucze.foreach ((klucz, indeks) =>
konsola.log ('$ key: $ kurses [key]');
);

Spójrz na dane wyjściowe podanego przykładu na obrazie poniżej:

Iterować obiekty w JavaScript, używając obiektu.Wartości () metoda

Obiekt JavaScript.Wartości () Metoda jest przeciwna do obiektu.metoda key () i została osadzona w ES8. Obiekt.Wartości () Metoda wyprowadza tablicę zawierającą wartości właściwości dodanego obiektu. Następnie możesz iterować wartości obiektów, wykorzystując metodę pętli tablicy, taką jak pętla JavaScript foreach ().

Przykład: iterowanie obiektów w JavaScript za pomocą obiektu.Wartości () metoda

Ten przykład pokaże, jak iterować za pomocą obiektu.Wartości () metoda za pomocą wartości obiektu. W tym celu stworzymy „ptaki„Obiekt o czterech właściwości”wrona”,„wróbel”,„papuga", I "Gołąb”Z ich odpowiednimi wartościami:

const Birds =
Crow: 1,
Sparrow: 2,
Papuga: 3,
Połącz: 4;

Teraz, aby iterować wartości „ptaki„Obiekt, wywołamy obiekt.Wartości () metoda podczas przekazywania „ptaki„Obiekt jako argument:

// iteruj za pomocą wartości obiektów
Obiekt.Wartości (ptaki).Foreach (val => konsola.log (val));

Sprawdź poniżej podane dane wyjściowe wartości obiektów iteracja:

Iterować obiekty w JavaScript, używając obiektu.Metoda wpisów ()

Inną metodą ES8, którą można wykorzystać do iteracji przez obiekty w JavaScript, jest „Obiekt.wpisy ()" metoda. Kiedy wywołasz obiekt.Metoda wpisów () Przekazując utworzony obiekt jako argument, zwróci dwa elementy w każdej wewnętrznej tablicy. Pierwszy element tablicy będzie reprezentował właściwość obiektu, a jej odpowiednia wartość będzie przechowywana w drugim elemencie.

Przykład: iterowanie obiektów w JavaScript za pomocą obiektu.Metoda wpisów ()

Aby użyć obiektu.Metoda wpisów () W programie JavaScript Utwórz obiekt z niektórymi właściwościami i ich wartościami. Na przykład stworzyliśmy „ptaki„Obiekt, który ma cztery właściwości:

const Birds =
Crow: 1,
Sparrow: 2,
Papuga: 3,
Połącz: 4;

Teraz, aby iterować przez „obiekt„Wartości, zdamy”ptaki„Object jako argument„Obiekt.wpisy ()„Metoda i przechowuj wartość zwrotu w„wpisy" zmienny:

// iteruj za pomocą wartości obiektów
const wpisy = obiekt.wpisy (ptaki);
konsola.log (wpisy);

Jak widać z podania poniżej, „Obiekt.wpisy ()„Metoda zwróciła cztery wewnętrzne tablice, w których każda tablica przechowuje jedną właściwość„ptaki„Obiekt wraz z jego wartością:

Aby iterować przez tablicę, zwracaną przez obiekt JavaScript.Metoda wpisów () możesz również użyć „dla każdego()”Metoda lub„Dla…" pętla.

Aby użyć dla… pętli, musisz napisać następujący kod po utworzeniu wymaganego obiektu ptaków:

dla (const [klucz, wartość] obiektu.wpisy (ptaki))
konsola.log ('$ key: $ wartość');

Z pomocą „Dla…„Pętla, z powodzeniem iteraowaliśmy”ptaki„Obiekt, który można zobaczyć na wyjściu:

W takim przypadku, jeśli chcesz użyć „dla każdego()„Metoda w tym samym celu, a następnie wywołaj obiekt.Metoda wpisów () podczas przekazywania utworzonego obiektu jako argumentu, a następnie wywołuje „dla każdego()" metoda. Metoda foreach () zwróci właściwości obiektu lub klucze i ich odpowiednie wartości:

// metoda foreach ()
Obiekt.wpisy (ptaki).foreach (([klucz, wartość]) =>
konsola.log ('$ key: $ wartość')
);

Wniosek

Używanie dla… w pętli, obiekt.Metoda key (), obiekt.Wartości () Metoda, obiekt.Metoda wpisów (), możesz iterować obiekty w JavaScript. For… w pętli, obiekt.Metoda wpisów () i obiekt.Metoda keys () jest używana do iteracji przez wartości pary klucza obiektu, podczas gdy obiekt.Wartości () tylko itera wartości właściwości obiektu. W tym spisie omówiono metody iteracji za pośrednictwem obiektów w JavaScript. Ponadto procedury związane z iteracją obiektów, takie jak… w pętli, obiekt.Metoda keys (), obiekt.wartości () metoda i obiekt.Metoda wpisów () jest również wykazywana z przykładami.