EDIT : tutti gli esempi seguenti in questa risposta sono stati modificati per includere una nuova variabile di percorso prodotta dall'iteratore come richiesto da @ supersan . La variabile path è una matrice di stringhe in cui ogni stringa nella matrice rappresenta ciascuna chiave a cui è stato effettuato l'accesso per ottenere il valore iterato risultante dall'oggetto di origine originale. La variabile path può essere inserita nella funzione / metodo get di lodash . Oppure potresti scrivere la tua versione di lodash's get che gestisce solo array in questo modo:
function get (object, path) {
return path.reduce((obj, pathItem) => obj ? obj[pathItem] : undefined, object);
}
const example = {a: [1,2,3], b: 4, c: { d: ["foo"] }};
// these paths exist on the object
console.log(get(example, ["a", "0"]));
console.log(get(example, ["c", "d", "0"]));
console.log(get(example, ["b"]));
// these paths do not exist on the object
console.log(get(example, ["e", "f", "g"]));
console.log(get(example, ["b", "f", "g"]));
EDIT : questa risposta modificata risolve infiniti spostamenti in loop.
Arresto di traversate di oggetti infiniti fastidiosi
Questa risposta modificata fornisce ancora uno dei vantaggi aggiuntivi della mia risposta originale che ti consente di utilizzare la funzione di generatore fornita al fine di utilizzare un'interfaccia iterabile più pulita e semplice (pensa a usare i for ofloop come in for(var a of b)dove bè un iterabile ed aè un elemento dell'iterabile ). Usando la funzione del generatore oltre ad essere un'API più semplice aiuta anche con il riutilizzo del codice rendendolo così che non devi ripetere la logica di iterazione ovunque tu voglia iterare profondamente sulle proprietà di un oggetto e rende anche possibile breakuscire da il ciclo se si desidera interrompere prima l'iterazione.
Una cosa che noto che non è stata affrontata e che non è nella mia risposta originale è che dovresti stare attento a attraversare oggetti arbitrari (cioè qualsiasi insieme "casuale" di), perché gli oggetti JavaScript possono essere autoreferenziali. Ciò crea l'opportunità di avere infiniti attraversamenti a ciclo continuo. I dati JSON non modificati, tuttavia, non possono essere autoreferenziali, quindi se stai utilizzando questo particolare sottoinsieme di oggetti JS non devi preoccuparti di infiniti spostamenti in loop e puoi fare riferimento alla mia risposta originale o ad altre risposte. Ecco un esempio di un attraversamento senza fine (nota che non è un pezzo di codice eseguibile, perché altrimenti si bloccherebbe la scheda del browser).
Anche nell'oggetto generatore nel mio esempio modificato ho optato per l'uso al Object.keysposto del for inquale scorre solo le chiavi non prototipo sull'oggetto. Puoi scambiarlo da solo se vuoi includere le chiavi del prototipo. Vedere la mia risposta sezione originale di seguito per entrambe le implementazioni con Object.keyse for in.
Peggio ancora: questo ciclo infinito su oggetti autoreferenziali:
//your object
var o = {
foo:"bar",
arr:[1,2,3],
subo: {
foo2:"bar2"
}
};
// this self-referential property assignment is the only edited line
// from the below original example which makes the traversal
// non-terminating (i.e. it makes it infinite loop)
o.o = o;
function* traverse(o, path=[]) {
for (var i of Object.keys(o)) {
const itemPath = path.concat(i);
yield [i,o[i],itemPath];
if (o[i] !== null && typeof(o[i])=="object") {
//going one step down in the object tree!!
yield* traverse(o[I], itemPath);
}
}
}
//that's all... no magic, no bloated framework
for(var [key, value, path] of traverse(o)) {
// do something here with each key and value
console.log(key, value, path);
}
Per salvarti da questo puoi aggiungere un set all'interno di una chiusura, in modo che quando la funzione viene chiamata per la prima volta inizia a costruire una memoria degli oggetti che ha visto e non continua l'iterazione una volta che incontra un oggetto già visto. Lo snippet di codice seguente lo fa e quindi gestisce infiniti casi di loop.
Meglio: questo non eseguirà un ciclo infinito su oggetti autoreferenziali:
//your object
var o = {
foo:"bar",
arr:[1,2,3],
subo: {
foo2:"bar2"
}
};
// this self-referential property assignment is the only edited line
// from the below original example which makes more naive traversals
// non-terminating (i.e. it makes it infinite loop)
o.o = o;
function* traverse(o) {
const memory = new Set();
function * innerTraversal (o, path=[]) {
if(memory.has(o)) {
// we've seen this object before don't iterate it
return;
}
// add the new object to our memory.
memory.add(o);
for (var i of Object.keys(o)) {
const itemPath = path.concat(i);
yield [i,o[i],itemPath];
if (o[i] !== null && typeof(o[i])=="object") {
//going one step down in the object tree!!
yield* innerTraversal(o[i], itemPath);
}
}
}
yield* innerTraversal(o);
}
console.log(o);
//that's all... no magic, no bloated framework
for(var [key, value, path] of traverse(o)) {
// do something here with each key and value
console.log(key, value, path);
}
Risposta originale
Per un modo più nuovo di farlo se non ti dispiace far cadere IE e supportare principalmente più browser attuali (controlla la tabella es6 di kangax per la compatibilità). Per questo puoi usare i generatori es2015 . Ho aggiornato la risposta di @ TheHippo di conseguenza. Ovviamente se vuoi davvero il supporto IE puoi usare il transpiler di babel JavaScript.
//your object
var o = {
foo:"bar",
arr:[1,2,3],
subo: {
foo2:"bar2"
}
};
function* traverse(o, path=[]) {
for (var i in o) {
const itemPath = path.concat(i);
yield [i,o[i],itemPath];
if (o[i] !== null && typeof(o[i])=="object") {
//going one step down in the object tree!!
yield* traverse(o[i], itemPath);
}
}
}
//that's all... no magic, no bloated framework
for(var [key, value, path] of traverse(o)) {
// do something here with each key and value
console.log(key, value, path);
}
Se si desidera solo le proprietà enumerabili proprie (in sostanza proprietà della catena non prototipo), è possibile modificarlo per iterare utilizzando Object.keyse un for...ofciclo invece:
//your object
var o = {
foo:"bar",
arr:[1,2,3],
subo: {
foo2:"bar2"
}
};
function* traverse(o,path=[]) {
for (var i of Object.keys(o)) {
const itemPath = path.concat(i);
yield [i,o[i],itemPath];
if (o[i] !== null && typeof(o[i])=="object") {
//going one step down in the object tree!!
yield* traverse(o[i],itemPath);
}
}
}
//that's all... no magic, no bloated framework
for(var [key, value, path] of traverse(o)) {
// do something here with each key and value
console.log(key, value, path);
}