per ... in loop in javascript - coppie di valore chiave

In JavaScript, gli oggetti archiviano e organizzano i dati in coppie di valore chiave. A volte, gli sviluppatori devono loop attraverso ogni coppia di valore chiave. JavaScript fornisce una varietà di loop, come "per" O "per ciascuno"Loops, ma sono abituati a iterare attraverso gli array. Per iterarsi attraverso gli oggetti, il "per ... in"Viene utilizzato loop, che iterate sulle proprietà di un oggetto.

Questo blog illustrerà il javascript per ... in loop.

Come usare i loop "per ... in" in javascript?

In JavaScript, il "per ... in"Loop viene utilizzato per iterare le proprietà dell'oggetto, comprese eventuali proprietà enumerabili dei suoi prototipi. Ogni proprietà e il suo valore saranno iterate nel ciclo.

Sintassi

Per iterating Objects JavaScript, utilizzare la seguente sintassi di per ... in loop:

per (variabile in oggetto)
// ..

Esempio

Innanzitutto, crea un oggetto di linguaggi di programmazione chiamati "Lang":

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

Ora, stampare tutte le coppie di valore chiave iterando l'oggetto usando per ... in loop:

per (const chiave in lang)
console.log ('$ key: $ lang [key]');

Si può vedere che il per ... in loop ha iteralmente iteralmente e stampato tutte le coppie di valore chiave sulla console:

Il per ... in loop può essere utile per ripetere attraverso le proprietà di un oggetto, ma può anche portare a comportamenti inaspettati se l'oggetto ha proprietà ereditate dai suoi prototipi. Per evitare questo, l'approccio migliore è utilizzare il "Oggetto.HasOwnProperty ()"Metodo all'interno del per ... in loop per verificare se la proprietà/attributo appartiene all'oggetto e non uno dei suoi prototipi.

Esempio

Itera le proprietà dell'oggetto usando il metodo HasOwnProperty ():

per (const chiave in lang)
Se (lang.HasOwnProperty (key))
console.log ('$ chiave -> $ lang [key]');

Puoi anche usare "Oggetto.tasti ()" O "Oggetto.inserimenti()"Metodi per ottenere un array dei nomi delle proprietà dell'oggetto o delle coppie di valore chiave, rispettivamente, e quindi iterare su quell'array.

Conclusione

IL "per ... in"Loop in JavaScript iterirà su tutti gli attributi enumerabili di un oggetto, compresi quelli ereditati attraverso la catena del prototipo. Il problema principale con il per ... in loop è che itera attraverso le proprietà della catena del prototipo. Quindi, per evitare questo uso, il "Oggetto.HasOwnProperty ()"Metodo all'interno del per ... in loop. In questo blog, abbiamo illustrato l'uso del per ... in loop in JavaScript.