Sia for…in che Object.keys() possono essere usati per iterare sulle proprietà Object, ma c'è una differenza tra loro.

per... dentro

Il ciclo ripeterà tutte le proprietà enumerabili dell'oggetto stesso e le proprietà dell'oggetto ereditate dalla sua catena di prototipi (le proprietà dei prototipi più vicini hanno la precedenza su quelle dei prototipi più lontani dall'oggetto nella sua catena di prototipi).

Un for...inciclo itera solo su proprietà enumerabili e non simboliche . Gli oggetti creati da costruttori incorporati come Arraye Objecthanno ereditato proprietà non enumerabili da Array.prototypee Object.prototype, come Arrayil metodo di indexOf()o Objectil metodo di toString(), che non verranno visitati nel for...inciclo .

Il ciclo seguente itera su tutte le proprietà enumerabili e non simbolichefor...in dell'oggetto e registra una stringa dei nomi delle proprietà e dei relativi valori.

const obj = { a: 1, b: 2, c: 3 };
for (const prop in obj) {
  console.log(`obj.${prop} = ${obj[prop]}`);
}
// Logs:
// "obj.a = 1"
// "obj.b = 2"
// "obj.c = 3"

Object.keys()restituisce una matrice i cui elementi sono stringhe corrispondenti ai nomi di proprietà con chiave stringa enumerabili trovati direttamente su object. Equivale a iterare con un for...inciclo, tranne per il fatto che un for...inciclo enumera anche le proprietà nella catena del prototipo. L'ordine dell'array restituito da Object.keys()è lo stesso di quello fornito da un for...inciclo.

Object.keys() di seguito esegue un'iterazione su tutte le proprietà enumerabili e non simboliche dell'oggetto e registra una stringa dei nomi delle proprietà e dei relativi valori.

const obj = { a: 1, b: 2, c: 3 };
for (let prop of Object.keys(obj)) {
  console.log(`obj.${prop} = ${obj[prop]}`);
}

// Logs:
// "obj.a = 1"
// "obj.b = 2"
// "obj.c = 3"

Conclusione

Sia for…in che Object.keys() sono usati per iterare su Object keys/proprietà, con l'unica differenza che for…in itera anche sulle proprietà enumerabili dell'oggetto ereditate dalla sua catena di prototipi, mentre Object.keys() no .

Pubblicherò altri argomenti relativi allo sviluppo di javascript e front-end, puoi supportarmi con l'iscrizione.

Riferimenti