Cómo iterar un arreglo JSON

Escrito por kevin lee | Traducido por daniel gómez villegas
  • Comparte
  • Twittea
  • Comparte
  • Pin
  • E-mail
Cómo iterar un arreglo JSON
Independiente de la plataforma, los datos de JSON se componen enteramente de texto. (Stockbyte/Stockbyte/Getty Images)

JSON, acrónimo de JavaScript Object Notation, hace de Internet un lugar más productivo al permitir a las computadoras intercambiar datos de manera eficiente. Basta con crear una matriz JSON consistente de claves y valores, y enviarla a otra computadora, y el software de la computadora puede extraer los datos y utilizarlos de una variedad de maneras. Si recibes una matriz JSON o creas uno propio, tienes la opción de recorrer sus datos. Mientras lo haces, puedes mostrar los valores de la matriz en la pantalla o almacenarlos en una base de datos para su uso posterior.

Nivel de dificultad:
Moderadamente fácil

Otras personas están leyendo

Instrucciones

  1. 1

    Abre el documento de una página web con el Bloc de notas o tu editor preferido de HTML o texto.

  2. 2

    Agrega el código siguiente a la sección de escritura del documento:

    var data = [ {"Name":"John", "City": "Miami"}, {"Name":"Jill", "City": "Denver"}]; var customerNames = []; var customerCities = [];

    iterateJSON(data);

    Esta primera declaración crea una matriz JSON llamada "datos". Contiene los datos del cliente en este ejemplo. Las claves de esta matriz son "Nombre" y "Ciudad". Los valores de Nombre y Ciudad en la primera clave son "Juan" y "Miami". Los valores de Nombre y Ciudad en la segunda clave son "Jill" y "Denver". Los siguientes dos comandos crean matrices vacías que contendrán los valores recuperados de la matriz JSON. La declaración final llama a una función llamada "itererateJSON" y pasa la matriz a esa función.

  3. 3

    Pega el código que se muestra a continuación después del código que aparece en la sección anterior:

    function iterateJSON(data) {

    var x = 1; var counter = 0;

    for (var val in data) {

    if (data.hasOwnProperty(val)) {var customerName = data[counter].Name; var customerCity = data[counter].City; alert("Customer Name = " + customerName + " .. Customer City = " + customerCity);

    customerNames.push(customerName); customerCities.push(customerCity); }

    counter++; } alert("Names Array = " + customerNames + " .. Cities Array = " + customerCities); }

    Esta función utiliza un ciclo "for" para recorrer la matriz JSON. Durante cada iteración, la función almacena el valor del nombre actual en la matriz customerName y el valor actual de la Ciudad en la matriz customerCity. Cuando el bucle termina, aparece una ventana de mensaje y muestra los valores en las dos matrices.

  4. 4

    Guarda el documento y obsérvalo en tu navegador. La función de JavaScript se ejecuta y recorre en iteración el objeto de datos. Un cuadro de mensaje se abre y muestra cada valor en el objeto. Después de que la función termina la iteración a través del objeto, muestra los valores de las matrices CustomerName y customerCity.

Consejos y advertencias

  • Este ejemplo demuestra copiar valores de JSON, Nombre y Ciudad, en dos matrices. Procesa los datos de la forma que quieras. Por ejemplo, puedes almacenar los valores en una base de datos en lugar de ponerlos en matrices. También puedes mostrarlos en una tabla o cuadrícula en tu página web a medida que el código recorre en iteración el objeto JSON.

No dejes de ver

Filtrar por:
  • Mostrar todos
  • Artículos
  • Galerías de fotos
  • Videos
Ordenar:
  • Más relevante
  • Más popular
  • Más reciente

No se encuentran artículos disponibles

No se encuentran slideshows disponibles

No se encuentran videos disponibles