parse - string to json javascript

¿Cómo itero sobre una estructura JSON?

Question

Esta pregunta ya tiene una respuesta aquí:

• ¿Para cada uno sobre una matriz en JavaScript? 28 respuestas

Tengo la siguiente estructura JSON:

[{ "id":"10", "class": "child-of-9" }, { "id": "11", "classd": "child-of-10" }]

¿Cómo itero sobre él usando jQuery o JavaScript?

Answer 1

Con objetos anidados, se puede recuperar como por función recursiva:

function inside(events)
{
for (i in events) {
if (typeof events[i] === ''object'')
inside(events[i]);
else
alert(events[i]);
}
}
inside(events);

donde como eventos es objeto json.

Answer 2

Copiado y pegado desde http://www.w3schools.com , no hay necesidad de la sobrecarga de JQuery.

var person = {fname:"John", lname:"Doe", age:25};
var text = "";
var x;
for (x in person) {
text += person[x];
}

RESULTADO: John Doe 25

Answer 3

Ejemplo de mootools:

var ret = JSON.decode(jsonstr);
ret.each(function(item){
alert(item.id+''_''+item.classd);
});

Answer 4

Este es un ejemplo puro de JavaScript comentado.

 <script language="JavaScript" type="text/javascript">
function iterate_json(){
// Create our XMLHttpRequest object
var hr = new XMLHttpRequest();
// Create some variables we need to send to our PHP file
hr.open("GET", "json-note.php", true);//this is your php file containing json
hr.setRequestHeader("Content-type", "application/json", true);
// Access the onreadystatechange event for the XMLHttpRequest object
hr.onreadystatechange = function() {
if(hr.readyState == 4 && hr.status == 200) {
var data = JSON.parse(hr.responseText);
var results = document.getElementById("myDiv");//myDiv is the div id
for (var obj in data){
results.innerHTML += data[obj].id+ "is"+data[obj].class + "<br/>";
}
}
}
hr.send(null);
}
</script>
<script language="JavaScript" type="text/javascript">iterate_json();</script>// call function here

Answer 5

Marquis Wang puede ser la mejor respuesta al usar jQuery.

Aquí hay algo bastante similar en JavaScript puro, utilizando el método forEach de JavaScript. forEach toma una función como un argumento. Luego se llamará a esa función para cada elemento de la matriz, con dicho elemento como argumento.

Corto y fácil:

<script>
var results = [ {"id":"10", "class": "child-of-9"}, {"id":"11", "classd": "child-of-10"}];
results.forEach( function( item ) {
console.log( item );
});
</script>

Answer 6

Otra solución para navegar a través de documentos JSON es JSONiq (implementado en el motor Zorba ), donde puede escribir algo como:

jsoniq version "1.0";
let $doc := [
{"id":"10", "class": "child-of-9"},
{"id":"11", "class": "child-of-10"}
]
for $entry in members($doc) (: binds $entry to each object in turn :)
return $entry.class (: gets the value associated with "class" :)

Puedes ejecutarlo en http://try.zorba.io/

Answer 7

Por favor déjame saber si no es fácil:

 var jsonObject = {
name: ''Amit Kumar'',
Age: ''27''
};
for (var prop in jsonObject) {
alert("Key:" + prop);
alert("Value:" + jsonObject[prop]);
}

Answer 8

Puede usar una mini biblioteca como objx - http://objx.googlecode.com/

Puedes escribir código como este:

var data = [ {"id":"10", "class": "child-of-9"},
{"id":"11", "class": "child-of-10"}];
// alert all IDs
objx(data).each(function(item) { alert(item.id) });
// get all IDs into a new array
var ids = objx(data).collect("id").obj();
// group by class
var grouped = objx(data).group(function(item){ return item.class; }).obj()

Hay más ''complementos'' disponibles para permitirle manejar datos como este, consulte http://code.google.com/p/objx-plugins/wiki/PluginLibrary

Answer 9

Si esta es tu dataArray :

var dataArray = [{"id":28,"class":"Sweden"}, {"id":56,"class":"USA"}, {"id":89,"class":"England"}];

entonces:

$(jQuery.parseJSON(JSON.stringify(dataArray))).each(function() {
var ID = this.id;
var CLASS = this.class;
});

Answer 10

Tomado de documentos de jQuery :

var arr = [ "one", "two", "three", "four", "five" ];
var obj = { one:1, two:2, three:3, four:4, five:5 };
jQuery.each(arr, function() {
$("#" + this).text("My id is " + this + ".");
return (this != "four"); // will stop running to skip "five"
});
jQuery.each(obj, function(i, val) {
$("#" + i).append(document.createTextNode(" - " + val));
});

Answer 11

Utilice foreach :

<html>
<body>
<script type="text/javascript">
var mycars = [{name:''Susita''}, {name:''BMW''}];
for (i in mycars)
{
document.write(mycars[i].name + "<br />");
}
</script>
</body>
</html>

Resultará en:

Susita
BMW

Answer 12

var arr = [ {"id":"10", "class": "child-of-9"}, {"id":"11", "classd": "child-of-10"}];
for (var i = 0; i < arr.length; i++){
var obj = arr[i];
for (var key in obj){
var attrName = key;
var attrValue = obj[key];
}
}

var arr = [ {"id":"10", "class": "child-of-9"}, {"id":"11", "class": "child-of-10"}];
for (var i = 0; i < arr.length; i++){
document.write("<br><br>array index: " + i);
var obj = arr[i];
for (var key in obj){
var value = obj[key];
document.write("<br> - " + key + ": " + value);
}
}

nota: el método for-in es genial para objetos simples. No es muy inteligente de usar con el objeto DOM.

Answer 13

var jsonString = "{/"schema/": {/"title/": /"User Feedback/", /"description/":/"so/", /"type/":/"object/", /"properties/":{/"name/":{/"type/":/"string/"}}}," +
"/"options/":{ /"form/":{/"attributes/":{}, /"buttons/":{ /"submit/":{ /"title/":/"It/", /"click/":/"function(){alert(''hello'');}/" }}} }}";
var jsonData = JSON.parse(jsonString);
function Iterate(data)
{
jQuery.each(data, function (index, value) {
if (typeof value == ''object'') {
alert("Object " + index);
Iterate(value);
}
else {
alert(index + " : " + value);
}
});
};
Iterate(jsonData);