Asesoría y capacitación en informática

Parsear un texto JSON con JavaScript

Parsear un texto JSON con JavaScript aprovechando su estructura

Haremos un ejemplo con respecto a la facilidad que se obtiene cuando usamos JSON sobre XML, al querer recorrer una estructura de datos, si dicha estructura está en formato JSON. Si esto es así, es muy fácil utilizar la función eval, para generar una variable JavaScript que recree la estructura de datos.

En este artículo, haremos una simple página HTML que utiliza un archivo javascript en dónde definiremos
en una cadena de texto una expresión válida JSON y usando la función eval, generaremos una variable de
la que podremos obtener la información contenida en el JSON utilizando notacion dot (nombreDeLaVariable.propiedad). En el evento onclick del botón, llamaremos a dicha función y mediante
el uso de varios alert, obtendremos la información contenida en la variable.

Pagina 1.html

Funciones

Nota: Para verificar que nuestra sintaxis JSON es correcta podemos usar el excelente verificador en linea JSONLint. Esta página nos permite ingresar una sentencia JSON y nos verificará si es correcta o no. (Ver Figuras 1 y 2). También existe otro verificador y reformateador muy valioso llamado JSON Formatter & Validator. (Ver Figura 3)
Cualquiera de estas dos herramientas nos ayudarán a la hora de validar y formatear correctamente un marcado JSON.

Explicación del código

Se trata de una simple página HTML que a la hora de cargarse en nuestro navegador se verá como muestra la figura 4, al pulsar el botón se van desplegando los alerts. La figura 5, muestra el primero de los 5 alerts que se muestran al hacer click en el botón.

Es importante destacar la manera en que se llama a la función eval:
var miLibro = eval(‘(‘ + cadena + ‘)’);

Nota: Observe que la variable cadena se envuelve entre paréntesis. Esto se hace para que JavaScript pueda evaluar correctamente la variable cadena, debido a las llaves que contiene.
Si bien para convertir un texto JSON en un objeto, como vimos en este ejemplo, se puede utilizar la función eval(), que invoca el compilador de JavaScript, no es segura ya que puede compilar y ejecutar cualquier programa JavaScript, por lo que puede haber problemas de seguridad. El uso de eval está indicado cuando la fuente es de confianza y competente. Es mucho más seguro utilizar un parser (analizador) JSON, como por ejemplo el método jQuery.parseJSON o jQuery.getJSON