Esegui il bucle attraverso un oggetto JavaScript

Abdul Mateen 12 ottobre 2023
  1. bucle di for-in per eseguire il bucle attraverso l’oggetto JavaScript
  2. Usa il bucle for-of per eseguire il loop attraverso l’oggetto JavaScript
  3. Utilizza il metodo forEach per eseguire il bucle attraverso l’oggetto JavaScript
Esegui il bucle attraverso un oggetto JavaScript

Questo articolo tutorial introdurrà come possiamo iterare un oggetto JavaScript.

Esistono diverse istruzioni di bucle e un metodo utilizzato per iterare attraverso un oggetto JavaScript è il seguente.

  • bucle for-in
  • bucle for-of
  • metodo forEach

bucle di for-in per eseguire il bucle attraverso l’oggetto JavaScript

L’istruzione for-in è un bucle utilizzato per iterare l’oggetto JavaScript con coppie chiave-valore. Questo bucle itera su tutti gli elementi dell’oggetto JavaScript.

Il codice di esempio per utilizzare il bucle for-in per eseguire il bucle attraverso l’oggetto JavaScript è il seguente.

var Cities = {
  City1: 'Tokyo',
  City2: 'Paris',
  City3: 'Dubai',
  City3: 'Rome',
  City4: 'London'
} for (var city in Cities) {
  console.log(city, ':', Cities[city]);
}

Produzione:

City1 : Tokyo
City2 : Paris
City3 : Dubai
City4 : Rome 
City5 : London

Durante l’utilizzo del bucle for-in, non è necessario utilizzare alcuna funzione speciale per iterare o eseguire il bucle di un oggetto.

Usa il bucle for-of per eseguire il loop attraverso l’oggetto JavaScript

L’istruzione for-of è anche un bucle che itera un oggetto iterabile che non ha coppie chiave-valore. Possiamo anche usare questo bucle per iterare l’oggetto JavaScript con coppie chiave-valore ma con alcune funzioni speciali come segue.

  • Object.getOwnPropertyNames
  • Object.entries
  • Object.keys
  • Reflect.ownKeys

Object.getOwnPropertyNames

Questo metodo restituisce un array di tutte le chiavi delle coppie chiave-valore memorizzate nell’oggetto. Ma per iterare tutte le coppie di valori-chiave dell’oggetto JavaScript, dobbiamo usare questo metodo con un bucle for-of.

Il codice di esempio per utilizzare il for-of con Object.getOwnPropertyNames() per iterare l’oggetto è il seguente.

var Cities = {
  City1: 'Tokyo',
  City2: 'Paris',
  City3: 'Dubai',
  City3: 'Rome',
  City4: 'London'
};
for (var city of Object.getOwnPropertyNames(Cities)) {
  const CityName = Cities[city];
  console.log(city, ':', CityName);
}

Produzione:

City1 : Tokyo
City2 : Paris
City3 : Dubai
City4 : Rome 
City5 : London

Object.entries

Questo metodo restituisce l’array della coppia chiave-valore dell’oggetto. Ma per iterare una chiave e un valore, dobbiamo usare il bucle for-of con questo metodo per scorrere l’oggetto JavaScript.

Il codice di esempio per utilizzare for-of con Object.entries() per iterare l’oggetto è il seguente.

var Cities = {
  City1: 'Tokyo',
  City2: 'Paris',
  City3: 'Dubai',
  City3: 'Rome',
  City4: 'London'
};
for (var [city, CityName] of Object.entries(Cities)) {
  console.log(city, ':', CityName);
}

Produzione:

City1 : Tokyo
City2 : Paris
City3 : Dubai
City4 : Rome 
City5 : London

Object.keys

Questo metodo restituisce l’array delle chiavi dell’oggetto. Ma per iterare coppie chiave-valore di un oggetto, dobbiamo usare questa funzione con il bucle for-of.

Il codice di esempio per utilizzare for-of con Object.keys() per iterare l’oggetto è il seguente.

var Cities = {
  City1: 'Tokyo',
  City2: 'Paris',
  City3: 'Dubai',
  City3: 'Rome',
  City4: 'London'
};
for (var city of Object.keys(Cities)) {
  console.log(city, ':', cities[city]);
}

Produzione:

City1 : Tokyo
City2 : Paris
City3 : Dubai
City4 : Rome 
City5 : London

Reflect.ownKeys

Questo metodo restituisce anche le chiavi dell’oggetto. Ma per iterare le coppie chiave-valore dell’oggetto, dobbiamo usare questa funzione con il bucle for-of.

Il codice di esempio per utilizzare il for-of con Reflect.ownKeys per iterare l’oggetto è il seguente.

var Cities = {
  City1: 'Tokyo',
  City2: 'Paris',
  City3: 'Dubai',
  City3: 'Rome',
  City4: 'London'
};
for (var city of Reflect.ownKeys(Cities)) {
  console.log(city, ':', cities[city]);
}

Produzione:

City1 : Tokyo
City2 : Paris
City3 : Dubai
City4 : Rome 
City5 : London

Utilizza il metodo forEach per eseguire il bucle attraverso l’oggetto JavaScript

Il metodo forEach funziona come un iteratore per chiamare l’altro metodo in modo sequenziale. Ma possiamo usare questo metodo per iterare l’oggetto usando molte altre funzioni che sono le seguenti.

  • Object.keys
  • Reflect.ownKeys

Object.keys

Usando questo metodo con il metodo forEach, possiamo iterare le coppie chiave-valore di un oggetto.

var Cities = {
  City1: 'Tokyo',
  City2: 'Paris',
  City3: 'Dubai',
  City3: 'Rome',
  City4: 'London'
};
Object.keys.forEach(city => {console.log(city, ':', Cities[city])})

Produzione:

City1 : Tokyo
City2 : Paris
City3 : Dubai
City4 : Rome 
City5 : London

Reflect.ownKeys

Usando questo metodo con il metodo forEach, possiamo iterare le coppie chiave-valore di un oggetto.

var Cities = {
  City1: 'Tokyo',
  City2: 'Paris',
  City3: 'Dubai',
  City3: 'Rome',
  City4: 'London'
};
Reflect.ownKeys.forEach(city => {console.log(city, ':', Cities[city])})

Produzione:

City1 : Tokyo
City2 : Paris
City3 : Dubai
City4 : Rome 
City5 : London

Articolo correlato - JavaScript Object