Javascript cómo analizar la matriz JSON


93

Estoy usando Sencha Touch (ExtJS) para obtener un mensaje JSON del servidor. El mensaje que recibo es este:

{
"success": true,
"counters": [
    {
        "counter_name": "dsd",
        "counter_type": "sds",
        "counter_unit": "sds"
    },
    {
        "counter_name": "gdg",
        "counter_type": "dfd",
        "counter_unit": "ds"
    },
    {
        "counter_name": "sdsData",
        "counter_type": "sds",
        "counter_unit": "   dd       "
    },
    {
        "counter_name": "Stoc final",
        "counter_type": "number    ",
        "counter_unit": "litri     "
    },
    {
        "counter_name": "Consum GPL",
        "counter_type": "number    ",
        "counter_unit": "litri     "
    },
    {
        "counter_name": "sdg",
        "counter_type": "dfg",
        "counter_unit": "gfgd"
    },
    {
        "counter_name": "dfgd",
        "counter_type": "fgf",
        "counter_unit": "liggtggggri     "
    },
    {
        "counter_name": "fgd",
        "counter_type": "dfg",
        "counter_unit": "kwfgf       "
    },
    {
        "counter_name": "dfg",
        "counter_type": "dfg",
        "counter_unit": "dg"
    },
    {
        "counter_name": "gd",
        "counter_type": "dfg",
        "counter_unit": "dfg"
    }

    ]
}

Mi problema es que no puedo analizar este objeto JSON para poder usar cada uno de los objetos de contador.

Estoy tratando de lograr eso de esta manera:

var jsonData = Ext.util.JSON.decode(myMessage);
for (var counter in jsonData.counters) {
     console.log(counter.counter_name);
 }

Qué estoy haciendo mal ? ¡Gracias!


1
Posible duplicado de convertir
T.Todua

Respuestas:


142

Javascript tiene un análisis JSON integrado para cadenas, que creo que es lo que tienes:

var myObject = JSON.parse("my json string");

usar esto con su ejemplo sería:

var jsonData = JSON.parse(myMessage);
for (var i = 0; i < jsonData.counters.length; i++) {
    var counter = jsonData.counters[i];
    console.log(counter.counter_name);
}

Aquí hay un ejemplo de trabajo

EDITAR : Hay un error en el uso del bucle for (me perdí esto en mi primera lectura, crédito a @Evert por el lugar). el uso de un bucle for-in establecerá var para que sea el nombre de propiedad del bucle actual, no los datos reales. Vea mi bucle actualizado arriba para el uso correcto

IMPORTANTE : el JSON.parsemétodo no funcionará en navegadores antiguos, por lo que si planea hacer que su sitio web esté disponible a través de algún tipo de conexión a Internet, esto podría ser un problema. Sin embargo, si realmente está interesado, aquí hay una tabla de soporte (que marca todas mis casillas).


1
Si usa una biblioteca que admita una función parseJSON entre navegadores, debería usarla. Además, repites el error de bucle.
Bergi

Recibo un error en la primera línea cuando ejecuto esto: Error de sintaxis no detectado: token inesperado o
noches

@noches: lo más probable es que tenga una cadena JSON no válida, pruebe una herramienta de validación JSON en línea, como esta
musefan

8

Esta es mi respuesta,

<!DOCTYPE html>
<html>
<body>
<h2>Create Object from JSON String</h2>
<p>
First Name: <span id="fname"></span><br> 
Last Name: <span id="lname"></span><br> 
</p> 
<script>
var txt = '{"employees":[' +
'{"firstName":"John","lastName":"Doe" },' +
'{"firstName":"Anna","lastName":"Smith" },' +
'{"firstName":"Peter","lastName":"Jones" }]}';

//var jsonData = eval ("(" + txt + ")");
var jsonData = JSON.parse(txt);
for (var i = 0; i < jsonData.employees.length; i++) {
    var counter = jsonData.employees[i];
    //console.log(counter.counter_name);
    alert(counter.firstName);
}

</script>
</body>
</html>

6

En un bucle for-in, la variable en ejecución contiene el nombre de la propiedad, no el valor de la propiedad.

for (var counter in jsonData.counters) {
    console.log(jsonData.counters[counter].counter_name);
}

Pero como counters es una matriz, debe usar un bucle for normal:

for (var i=0; i<jsonData.counters.length; i++) {
    var counter = jsonData.counters[i];
    console.log(counter.counter_name);
}

1

La "forma Sencha" para interactuar con los datos del servidor es configurar un Ext.data.Storeproxy Ext.data.proxy.Proxy(en este caso Ext.data.proxy.Ajax) provisto de un Ext.data.reader.Json(para datos codificados en JSON, también hay otros lectores disponibles). Para volver a escribir datos en el servidor, existen Ext.data.writer.Writervarios tipos de correos electrónicos .

Aquí hay un ejemplo de una configuración como esa:

    var store = Ext.create('Ext.data.Store', {
        fields: [
            'counter_name',
            'counter_type',
            'counter_unit'
        ],

        proxy: {
            type: 'ajax',
            url: 'data1.json',

            reader: {
                type: 'json',
                idProperty: 'counter_name',
                rootProperty: 'counters'
            }
        }
    });

data1.jsonen este ejemplo (también disponible en este violín ) contiene sus datos textualmente. idProperty: 'counter_name'es probablemente opcional en este caso, pero normalmente apunta al atributo de clave principal. rootProperty: 'counters'especifica qué propiedad contiene una matriz de elementos de datos.

Con una configuración de tienda de esta manera, puede volver a leer los datos del servidor llamando store.load(). También puede conectar la tienda a cualquier componente de interfaz de usuario apropiado de Sencha Touch, como cuadrículas, listas o formularios.



0

¡Esto funciona como un encanto!

Así que edité el código según mi requisito. Y aquí están los cambios: guardará el número de identificación de la respuesta en la variable de entorno.

var jsonData = JSON.parse(responseBody);
for (var i = 0; i < jsonData.data.length; i++)
{
    var counter = jsonData.data[i];
    postman.setEnvironmentVariable("schID", counter.id);
}

0

La respuesta con el voto más alto tiene un error. cuando lo usé lo descubrí en la línea 3:

var counter = jsonData.counters[i];

Lo cambié a:

var counter = jsonData[i].counters;

Y funcionó para mí. Hay una diferencia con las otras respuestas en la línea 3:

var jsonData = JSON.parse(myMessage);
for (var i = 0; i < jsonData.counters.length; i++) {
    var counter = jsonData[i].counters;
    console.log(counter.counter_name);
}

1
Quizás te refieres a lata donde dijiste que debería . Sin embargo, es mejor si agrega más detalles / explicaciones a su código, eso ayudará mejor a OP y a otras personas que tienen la misma pregunta.
Tiw

También puede explicar un poco por qué eligió este método para que el usuario aprenda un poco más. Eso ayudaría a mejorar esta respuesta.
TsTeaTime

la respuesta con más votos respondió esta pregunta, pero cuando la uso entendí que estaba mal en la línea 4: var counter = jsonData.counters [i]; Pero lo cambio a: var counter = jsonData [i] .counters; Y funcionó. así que dije poder en lugar de debería.
Mahdi Jalali

0

Solo como un aviso ...

var data = JSON.parse(responseBody);

ha quedado obsoleto .

Postman Learning Center ahora sugiere

var jsonData = pm.response.json();

-1

Debe utilizar un almacén de datos y un proxy en ExtJs. Hay muchos ejemplos de esto, y el lector JSON analiza automáticamente el mensaje JSON en el modelo que especificó.

No hay necesidad de usar Javascript básico al usar ExtJs, todo es diferente, debe usar las formas de ExtJs para hacer todo bien. Lea la documentación con atención, es buena.

Por cierto, estos ejemplos también son válidos para Sencha Touch (especialmente v2), que se basa en las mismas funciones básicas que ExtJs.


-1

No estoy seguro de si mis datos coincidían exactamente, pero tenía una matriz de matrices de objetos JSON, que se exportaron desde jQuery FormBuilder al usar páginas.

Espero que mi respuesta pueda ayudar a cualquiera que se encuentre con esta pregunta en busca de una respuesta a un problema similar al que yo tenía.

Los datos se parecían a esto:

var allData = 
[
    [
        {
            "type":"text",
            "label":"Text Field"
        }, 
        {
            "type":"text",
            "label":"Text Field"
        }
    ],
    [
        {
            "type":"text",
            "label":"Text Field"
        }, 
        {
            "type":"text",
            "label":"Text Field"
        }
    ]
]

Lo que hice para analizar esto fue simplemente hacer lo siguiente:

JSON.parse("["+allData.toString()+"]")
Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.