Dla… w pętlach w JavaScript - para kluczowych

W JavaScript obiekty przechowują i organizują dane w parach kluczowych. Czasami programiści muszą zapętlić każdą parę wartości kluczowej. JavaScript zapewnia różnorodne pętle, takie jak „Do" Lub "dla każdego”Pętle, ale są przyzwyczajeni do iteracji przez tablice. Do iteracji przez obiekty, „dla w„Używana jest pętla, która itera nad właściwościami obiektu.

Ten blog ilustruje JavaScript dla… w pętli.

Jak używać pętli „for… in” w JavaScript?

W JavaScript „The„dla w„Pętla jest używana do iteracji właściwości obiektu, w tym wszelkich wymienionych właściwości jego prototypów. Każda właściwość i jej wartość zostaną iterowane w pętli.

Składnia

Aby iterować obiekty JavaScript, użyj następującej składni dla… w pętli:

dla (zmienna w obiekcie)
//…

Przykład

Najpierw utwórz obiekt języków programowania o nazwie „Lang”:

const lang =
HTML: 20,
CSS: 65,
JavaScript: 23,
NodeJS: 8

Teraz wydrukuj wszystkie pary wartości kluczowej, iteracyjnym obiekt za pomocą… w pętli:

dla (klucz const in lang)
konsola.log ('$ key: $ lang [key]');

Można zauważyć, że… w pętli z powodzeniem iterowało i wydrukowała wszystkie pary wartości kluczowej na konsoli:

For… w pętli może być przydatne do iteracji przez właściwości obiektu, ale może również prowadzić do nieoczekiwanego zachowania, jeśli obiekt ma właściwości odziedziczone po jego prototypach. Aby tego uniknąć, najlepszym podejściem jest wykorzystanie „Obiekt.HasownProperty ()„Metoda wewnątrz… w pętli, aby sprawdzić, czy właściwość/atrybut należy do obiektu, a nie jednego z jego prototypów.

Przykład

Iteruj własne właściwości obiektu za pomocą metody HasownProperty ():

dla (klucz const in lang)
if (lang.HasownProperty (klucz))
konsola.log ('$ key -> $ lang [key]');

Możesz także użyć "Obiekt.Klucze()" Lub "Obiekt.wpisy ()”Metody uzyskania odpowiednio tablicy własnych nazw właściwości obiektu lub par kluczowych, a następnie iterowanych nad tą tablicą.

Wniosek

„„dla w„Pętla w JavaScript będzie iterowana we wszystkich wyliczalnych atrybutach obiektu, w tym tych odziedziczonych za pomocą łańcucha prototypowego. Głównym problemem związanym z… w pętli jest to, że iteruje on właściwości łańcucha prototypowego. Aby uniknąć tego użycia, „Obiekt.HasownProperty ()„Metoda wewnątrz… w pętli. Na tym blogu zilustrowaliśmy użycie… w pętli w JavaScript.