¿Cómo puedo recorrer este tipo de array???
El problema es que tengo una function que me retorna un array = []
creado a partir de una respuesta json de jQuery. luego de conversion a un array[]
, no puedo acceder a los elementos.
¿Cómo puedo recorrer este tipo de array???
El problema es que tengo una function que me retorna un array = []
creado a partir de una respuesta json de jQuery. luego de conversion a un array[]
, no puedo acceder a los elementos.
Aquí te dejo una rutina general que te permite recorrer un objeto independientemente de su estructura.
Ejemplo:
array=[ {
item1:"value1",
item2:{
item1:"value1",
item2:"value2",
item3:{
item1:"value1",
item2:"value2",
item3:"value3",
item4:{
item1:"value1",
item2:"value2",
item3:"value3",
item4:"value4",
item5:"value5"
}
}
}
}]
// funcion para Recorer el Array, (parent = nombre del objeto padre)
function search(array,parent) {
// iterar en cada elemento del Array:
for (child in array) {
// Si el Elemento es un Objeto:
if (typeof array[child] == "object") {
// Entonces invoco la función search(..) para recorrer el Objeto
// Paso como parámetros el Objeto y Nombre del Elemento (parent):
search(array[child],parent+child+".");
} else {
// De no ser un Objeto imprime:
// El nombre del Elemento al cual podemos acceder:
console.log(parent+child+":");
// y el Valor del Elemento:
console.log(array[child]);
};
};
};
search(array[0],"");
Una vez conocido los elementos que componen el objeto quedara de tu parte que hacer con ellos.
En el siguiente ejemplo intentare recrear un json como el que planteas en tu imagen, luego recorreremos el objeto creando un <select>
y un <table>
Ejemplo:
array = [
{
"0": {
"id": "1",
"nombre": "PRIMERO"
},
"1": {
"id": "2",
"nombre": "SEGUNDO"
},
"2": {
"id": "3",
"nombre": "TERCERO"
},
"3": {
"id": "4",
"nombre": "CUARTO"
},
"4": {
"id": "5",
"nombre": "QUINTO"
},
"5": {
"id": "6",
"nombre": "SEXTO"
},
"6": {
"id": "7",
"nombre": "SEPTIMO"
},
"7": {
"id": "8",
"nombre": "OCTAVO"
},
"8": {
"id": "9",
"nombre": "NOVENO"
},
"9": {
"id": "10",
"nombre": "DECIMO"
},
"10": {
"id": "11",
"nombre": "DECIMO PRIMERO"
}
}
];
// Obtiene el Objeto que esta dentro del Array (elemento 0)
obj = array[0];
// Crea el elemento html <select>
select = document.createElement("select");
// recorre obj
for(i in obj) {
// Crea el elemento html <option>
option = document.createElement("option");
// Asigna el valor del elemento <option value="..">
option.value = obj[i].id;
// Asigna el texto del elemento <option>texto<option>
option.text = obj[i].nombre;
// Añade el elemento <option> al <select>
select.appendChild(option);
};
// Añade el elemento <select> al <body> de la pagina
document.body.appendChild(select);
// Crea el elemento html <table>
table = document.createElement("table");
// recorre obj
for(i in obj) {
// Crea el elemento html <tr>
tr = document.createElement("tr");
// Asigna el valor id <td>id.. </td> a <tr>
td = document.createElement("td");
td.innerHTML=obj[i].id;
tr.appendChild(td);
// Asigna el valor nombre <td>nombre.. </td> a <tr>
td = document.createElement("td");
td.innerHTML=obj[i].nombre;
tr.appendChild(td);
// Añade el elemento <tr> a <table>
table.appendChild(tr);
};
// Añade el elemento <table> al <body> de la pagina
document.body.appendChild(table);
table, td {
border: 1px solid ;
}
Espero esto te sirve, Saludos!! ;))...
pf
es el nombre del objeto padre. tienes una Array donde hay un solo elemento, y ese elemento a su vez se compone de objetos que a su ves tiene mas objetos, es por ello que con la función que te deje podrás recorrer esa estructura e ir conociendo los elementos que la componen.
En realidad lo que tienes ahí es un array de un único elemento.
Este elemento es un objeto donde si tienes los diferentes elementos por los que intentas iterar:
// Este es el array que tienes en realidad
var foo = [{0: {id: '1', nombre: 'PRIMERO'}, 1: {id: '2', nombre: 'SEGUNDO'}, 2: {id: '3', nombre: 'TERCERO'}, 3: {id: '4', nombre: 'CUARTO'}, 4: {id: '5', nombre: 'QUINTO'}, 5: {id: '6', nombre: 'SEXTO'}, 6: {id: '7', nombre: 'SEPTIMO'}, 7: {id: '8', nombre: 'OCTAVO'}, 8: {id: '9', nombre: 'NOVENO'}, 9: {id: '10', nombre: 'DECIMO'}, 10: {id: '11', nombre: 'DECIMOPRIMERO'} }];
//console.log(foo);
// Para recorrerlo:
for (var i in foo[0]){
console.log('id: ' + foo[0][i].id + ', nombre: ' + foo[0][i].nombre + '\n');
}