¿Qué es JSON y por qué lo usaría?

542

Lo busqué en Wikipedia y lo busqué en Google y leí la documentación oficial, pero aún no he llegado al punto en el que realmente entiendo qué es JSON y por qué lo usaría.

He estado creando aplicaciones usando PHP, MySQL y Javascript / HTML por un tiempo, y si JSON puede hacer algo para hacerme la vida más fácil o mejorar mi código o mi interfaz de usuario, me gustaría saberlo. ¿Alguien puede darme una explicación sucinta?

Ben
fuente
2
JSON es un subconjunto de YAML yaml.org
Brad Gilbert
15
copterlabs.com/blog/json-what-it-is-how-it-works-how-to-use-es este es un buen ejemplo sencillo de uso
Tom
1
Lea también sobre I-JSON: tbray.org/ongoing/When/201x/2015/03/23/i-json
Christophe Roussy el
1
+ Brad Gilbert No realmente: es su propia forma de expresar datos, y es similar a JSON solo porque ambos expresan objetos como cadenas (de manera similar a XML o plists o muchos otros), pero JSON es mejor para la escritura automática y YAML para la escritura humana .
Ben Aubin

Respuestas:

649

JSON (JavaScript Object Notation) es un formato ligero que se utiliza para el intercambio de datos. Se basa en un subconjunto de lenguaje JavaScript (la forma en que los objetos se crean en JavaScript). Como se indica en el MDN , algunos JavaScript no son JSON, y algunos JSON no son JavaScript.

Un ejemplo de dónde se usa esto son las respuestas de servicios web. En los viejos tiempos, los servicios web usaban XML como su formato de datos principal para transmitir datos, pero desde que apareció JSON ( el formato JSON se especifica en RFC 4627 por Douglas Crockford ), ha sido el formato preferido porque es mucho más ligero

Puede encontrar mucha más información en el sitio web oficial de JSON .

JSON se basa en dos estructuras:

  • Una colección de pares de nombre / valor. En varios idiomas, esto se realiza como un objeto, registro, estructura, diccionario, tabla hash, lista con clave o matriz asociativa.
  • Una lista ordenada de valores. En la mayoría de los idiomas, esto se realiza como una matriz, vector, lista o secuencia.

Estructura JSON



Diagrama de objetos JSON

Diagrama de matriz JSON

Diagrama de valores JSON

Diagrama de cadena JSON

Diagrama de números JSON

Aquí hay un ejemplo de datos JSON:

{
     "firstName": "John",
     "lastName": "Smith",
     "address": {
         "streetAddress": "21 2nd Street",
         "city": "New York",
         "state": "NY",
         "postalCode": 10021
     },
     "phoneNumbers": [
         "212 555-1234",
         "646 555-4567"
     ]
 }

JSON en JavaScript

¡JSON (en Javascript) es una cadena!

La gente a menudo asume que todos los objetos Javascript son JSON y que JSON es un objeto Javascript. Esto es incorrecto.

En Javascript novar x = {x:y} es JSON , este es un objeto Javascript . Los dos no son lo mismo. El equivalente JSON (representado en el lenguaje Javascript) sería var x = '{"x":"y"}'. xes un objeto de tipo cadena, no un objeto en sí mismo. Para convertir esto en un objeto Javascript completo, primero debe analizarlo var x = JSON.parse('{"x":"y"}');, xahora es un objeto pero ya no es JSON.

Ver objeto Javascript Vs JSON


Al trabajar con JSON y JavaScript, puede tener la tentación de usar la evalfunción para evaluar el resultado devuelto en la devolución de llamada, pero esto no se sugiere ya que hay dos caracteres (U + 2028 y U + 2029) válidos en JSON pero no en JavaScript (Lea más de esto aquí ).

Por lo tanto, uno siempre debe intentar usar el script de Crockford que verifica si hay un JSON válido antes de evaluarlo. El enlace a la explicación del script se encuentra aquí y aquí hay un enlace directo al archivo js. Cada navegador importante hoy en día tiene su propia implementación para esto.

Ejemplo sobre cómo usar el analizador JSON (con el json del fragmento de código anterior):

//The callback function that will be executed once data is received from the server
var callback = function (result) {
    var johnny = JSON.parse(result);
    //Now, the variable 'johnny' is an object that contains all of the properties 
    //from the above code snippet (the json example)
    alert(johnny.firstName + ' ' + johnny.lastName); //Will alert 'John Smith'
};

El analizador JSON también ofrece otro método muy útil, stringify. Este método acepta un objeto JavaScript como parámetro y devuelve una cadena con formato JSON. Esto es útil para cuando desea enviar datos de vuelta al servidor:

var anObject = {name: "Andreas", surname : "Grech", age : 20};
var jsonFormat = JSON.stringify(anObject);
//The above method will output this: {"name":"Andreas","surname":"Grech","age":20}

Los dos métodos anteriores ( parsey stringify) también toman un segundo parámetro, que es una función que se invocará para cada clave y valor en cada nivel del resultado final, y cada valor será reemplazado por el resultado de su función ingresada. (Más sobre esto aquí )

Por cierto, para todos los que piensan que JSON es solo para JavaScript, consulte esta publicación que explica y confirma lo contrario.


Referencias

Andreas Grech
fuente
1
Independientemente de la forma en que se serializa la información, tendrá un analizador, ¿verdad? Por lo tanto, a quién le importa qué formato utilice para transmitir datos si sus detalles de implementación se van a abstraer.
Tom Lehman
66
Bueno, en realidad, si está transmitiendo datos hacia y desde el cliente y el servidor, creo que es muy importante tener cuidado con los tamaños de sus respuestas.
Andreas Grech
99
Para los pedantes, hay un par de caracteres que JSON maneja de manera diferente a JavaScript, evitando que sea un subconjunto estricto: timelessrepo.com/json-isnt-a-javascript-subset
Jeremy Banks
Cuando dice que es más liviano que XML, ¿se refiere al tamaño del archivo o liviano tiene un significado especial en la codificación?
whatahitson
1
Entonces, ¿reemplazarías XML con JSON? ¿Es eso lo que estás diciendo? Si es así ... Genial, xml es una pesadilla.
James111
66

El concepto explicado: sin código ni jerga técnica

¿Qué es el JSON? - Cómo se lo expliqué a mi esposa TM

Yo: “Básicamente es una forma de comunicarse con alguien por escrito ... pero con reglas muy específicas.

Esposa: si ....?

Yo: en inglés prosaico, las reglas son bastante flexibles: al igual que con la lucha en jaula. No es así con JSON. Hay muchas formas de describir algo:

• Ejemplo 1: Nuestra familia tiene 4 personas: usted, yo y 2 niños.

• Ejemplo 2: Nuestra familia: usted, yo, niño1 y niño2.

• Ejemplo 3: Familia: [usted, yo, niño1, niño2]

• Ejemplo 4: tenemos 4 personas en nuestra familia: mamá, papá, niño1 y niño2.

Esposa: ¿Por qué no usan simplemente inglés en su lugar?

Yo: Lo harían, pero recuerda que estamos tratando con computadoras. Una computadora es estúpida y no podrá entender oraciones. Así que debemos ser realmente específicos cuando las computadoras están involucradas, de lo contrario se confunden. Además, JSON es una forma bastante eficiente de comunicarse, por lo que la mayoría de las cosas irrelevantes se eliminan, lo que es bastante útil. Si quisieras comunicar a nuestra familia a una computadora, una forma de hacerlo es así:

{
                "Family" :  ["Me", "Wife", "Kid1", "Kid2"] 
}

...... y eso es básicamente JSON. Pero recuerde, DEBE obedecer las reglas gramaticales de JSON. Si infringe esas reglas, una computadora simplemente no entenderá (es decir, analizará) lo que está escribiendo.

Esposa: Entonces, ¿cómo escribo en Json?

Una buena manera sería utilizar un serializador json, que es una biblioteca que hace el trabajo pesado por usted.

Resumen

JSON es básicamente una forma de comunicar datos a alguien, con reglas muy, muy específicas. Uso de pares y matrices de valor clave. Este es el concepto explicado, en este punto vale la pena leer las reglas específicas anteriores.

BKSpurgeon
fuente
48

En resumen, JSON es una forma de serialización de tal manera que se convierte en código JavaScript. Cuando se ejecuta (con eval o de otro modo), este código crea y devuelve un objeto JavaScript que contiene los datos que serializó. Esto está disponible porque JavaScript permite la siguiente sintaxis:

var MyArray = [ 1, 2, 3, 4]; // MyArray is now an array with 4 elements
var MyObject = {
    'StringProperty' : 'Value',
    'IntProperty' : 12,
    'ArrayProperty' : [ 1, 2, 3],
    'ObjectProperty' : { 'SubObjectProperty': 'SomeValue' }
}; // MyObject is now an object with property values set.

Puede usar esto para varios propósitos. Por un lado, es una forma cómoda de pasar datos de su servidor a su código JavaScript. Por lo tanto, esto se usa a menudo en AJAX.

También puede usarlo como un mecanismo de serialización independiente, que es más simple y ocupa menos espacio que XML. Existen muchas bibliotecas que le permiten serializar y deserializar objetos en JSON para varios lenguajes de programación.

Vilx-
fuente
31

En resumen, es una notación de script para pasar datos sobre. De alguna manera, una alternativa a XML, que admite de forma nativa tipos de datos básicos, matrices y matrices asociativas (pares de nombre-valor, llamados Objetos porque eso es lo que representan).

La sintaxis es la que se usa en JavaScript y JSON significa "notación de objetos JavaScript". Sin embargo, se ha vuelto portátil y también se usa en otros idiomas.

Un enlace útil para detalles está aquí:

http://secretgeek.net/json_3mins.asp

mson
fuente
19

El formato JSON se usa a menudo para serializar y transmitir datos estructurados a través de una conexión de red. Se utiliza principalmente para transmitir datos entre un servidor y una aplicación web, y sirve como alternativa al XML.

Pinakin Nayi
fuente
16

JSON es la notación de objetos de JavaScript. Es una forma mucho más compacta de transmitir conjuntos de datos a través de conexiones de red en comparación con XML. Sugiero que JSON se use en cualquier aplicación similar a AJAX donde XML sería la opción "recomendada". La verbosidad de XML aumentará el tiempo de descarga y el mayor consumo de ancho de banda ($$$). Puede lograr el mismo efecto con JSON y su marcado está dedicado casi exclusivamente a los datos en sí y no a la estructura subyacente.

Nolte
fuente
11

la respuesta corta común es: si está utilizando AJAX para realizar solicitudes de datos, puede enviar y devolver objetos fácilmente como cadenas JSON. Las extensiones disponibles para Javascript admiten toJSON () en todos los tipos de javascript para enviar datos al servidor en una solicitud AJAX. Las respuestas AJAX pueden devolver objetos como cadenas JSON que se pueden convertir en objetos Javascript mediante una simple llamada de evaluación, por ejemplo, si la función AJAX devuelve someAjaxFunctionCallReturningJson

"{ \"FirstName\" : \"Fred\", \"LastName\" : \"Flintstone\" }"

podrías escribir en Javascript

var obj = eval("(" + someAjaxFunctionCallReturningJson().value + ")");
alert(obj.FirstName);
alert(obj.LastName);

JSON también se puede usar para cargas de servicio web y otros, pero es realmente conveniente para los resultados de AJAX.

  • Actualización (diez años después): no haga esto, use JSON.parse
Steven A. Lowe
fuente
1
Con eval (), cualquier cosa sería evaluada. Es un riesgo de seguridad.
Thomas Weller
@ThomasWeller, sí, esta respuesta es antigua, iría con JSON.parse ahora, ¡gracias!
Steven A. Lowe
8

Me gusta JSON principalmente porque es muy conciso . Para el contenido web que se puede comprimir, esto no es necesariamente un gran problema (de ahí que x html sea tan popular). Pero hay ocasiones en que esto puede ser beneficioso.

Por ejemplo, para un proyecto estaba transmitiendo información que necesitaba ser serializada y transmitida a través de XMPP . Como la mayoría de los servidores limitarán la cantidad de datos que puede transmitir en un solo mensaje, me pareció útil usar JSON sobre la alternativa obvia, XML.

Como beneficio adicional, si está familiarizado con Python o Javascript, ya conoce JSON y puede interpretarlo sin mucha capacitación.

Jason Baker
fuente
8

¿Qué es el JSON?

JavaScript Object Notation (JSON) es un formato ligero de intercambio de datos inspirado en los literales de objetos de JavaScript.

Los valores JSON pueden consistir en:

objetos (colecciones de pares nombre-valor) matrices (listas ordenadas de valores) cadenas (entre comillas dobles) números verdaderos, falsos o nulos

JSON es independiente del lenguaje.

JSON con PHP?

Después de la versión 5.2.0 de PHP, la extensión JSON decodifica y codifica funcionalidades por defecto.

Json_encode - devuelve la representación JSON de valores Json_decode - Decodifica la cadena JSON Json_last_error - Devuelve el último error ocurrido.

¿Sintaxis y reglas de JSON?

La sintaxis JSON se deriva de la sintaxis de notación de objetos JavaScript:

Los datos están en pares de nombre / valor Los datos están separados por comas Las llaves contienen objetos Los corchetes contienen matrices

Elangovan
fuente
4

Tenemos que hacer un proyecto en la universidad y nos enfrentamos a un problema muy grande, se llama Política del mismo origen. Entre otras cosas, hace que su método XMLHttpRequest de Javascript no pueda realizar solicitudes a dominios distintos del dominio en el que se encuentra su sitio.

Por ejemplo, no puede hacer una solicitud a www.otherexample.com si su sitio está en www.example.com. JSONRequest lo permite, pero obtendrá el resultado en formato JSON si ese sitio lo permite (por ejemplo, tiene un servicio web que devuelve mensajes en JSON). Ese es un problema en el que podrías usar JSON tal vez.

Aquí hay algo práctico: Yahoo JSON

gljivar
fuente
4

La diferencia entre JSON y la sintaxis convencional sería la siguiente (en Javascript)

Convencional

 function Employee(name, Id, Phone, email){

      this.name = name;
      this.Id = Id;
      this.Phone = Phone;
      this.email = email;
  }

  //access or call it as 

var Emp = new Employee("mike","123","9373849784","[email protected]");

Con JSON

si usamos JSON podemos definir de manera diferente como

  function Employee(args){

   this.name = args.name;
   this.Id = args.Id;
   this.Phone = args.Phone;
   this.email = args.email;
}

//now access this as...

var Emp = new Employee({'name':'Mike', 'Id':'123', 'Phone':'23792747', 'email':'[email protected]'});

Lo importante que debemos recordar es que, si tenemos que construir la clase o modal "Empleado" con 100 elementos sin el método JSON, tenemos que analizar todo al crear la clase. Pero con JSON podemos definir los objetos en línea solo cuando se define un nuevo objeto para la clase.

así que esta línea a continuación es la forma de hacer cosas con JSON (solo una forma simple de definir cosas)

 var Emp = new Employee({'name':'Mike', 'Id':'123', 'Phone':'23792747', 'email':'[email protected]'});
Ganesh Vellanki
fuente
2
Eso no es exactamente JSON: es un objeto Javascript (no JSON)
Ben Aubin
4

A veces se da tecnicismo donde no se requiere ninguno, y aunque muchas de las respuestas más votadas son precisas, técnicas y específicas, personalmente no creo que sean más fáciles de entender o concisas, como lo que se puede encontrar en Wikipedia o en documentación oficial

La forma en que me gusta pensar en JSON es exactamente lo que es: un idioma dentro de un mundo de diferentes idiomas. Sin embargo, la diferencia entre JSON y otros idiomas es que "todos" hablan "JSON, junto con su" idioma nativo ".

Usando un ejemplo del mundo real, imaginemos que tenemos tres personas. Una persona habla igbo como lengua materna. A la segunda persona le gustaría interactuar con la primera persona, sin embargo, la primera persona habla yoruba como su primer idioma.

¿Qué podemos hacer?

Afortunadamente, la tercera persona en nuestro ejemplo creció hablando Inglés, pero también pasa a hablar tanto Igbo y Yoruba como segunda lengua, y así puede actuar como intermediario entre los dos primeros individuos.

En el mundo de la programación, la primera "persona" es Python, la segunda "persona" es Ruby, y la tercera "persona" es JSON, ¡quien resulta ser capaz de "traducir" Ruby a Python y viceversa! Ahora, obviamente, esta analogía no es perfecta, pero, como alguien que es bilingüe, creo que es una manera fácil de ver cómo JSON interactúa con otros lenguajes de programación.

Jerel
fuente
2

Es muy simple. JSON significa Java Script Object Notation. Piense en ello como una alternativa al uso de XML para transferir datos entre componentes de software.

Por ejemplo, recientemente escribí un grupo de servicios web que devolvieron JSON, y algunos desarrolladores de Javascript escribieron un código que llamaba a los servicios y consumía la información devuelta en ese formato.

Jon
fuente
2

JSON (notación de objeto Javascript) es un formato de datos ligero para el intercambio / transferencia de datos. Está en un par de valores clave como el JavaScript. Para la API REST se usa ampliamente para la transferencia de datos del servidor al cliente. Hoy en día, muchos de los sitios de redes sociales están usando esto. Aunque no veo esto tan robusto como XML con respecto a los tipos de datos. XML tiene tipos de datos muy ricos y XSD. A JSON le falta un poco en esto.

Para la misma cantidad de datos de cadena, JSON será más ligero en comparación con XML, ya que XML tiene todas esas etiquetas de apertura y cierre, etc.

Shailendra Singh
fuente
0

En el contexto de Java, una razón por la que JSON podría querer ser utilizado, es que proporciona una muy buena alternativa al marco de serialización de Java, que se ha demostrado (históricamente) que está sujeto a algunas vulnerabilidades bastante graves.

Joshua Bloch discute esto en profundidad en el Artículo 85 "Prefiera alternativas a la serialización de Java" (Java 3rd Edition efectiva)

La serialización de Java inicialmente tenía la intención de traducir las estructuras de datos a un formato que pudiera transmitirse o almacenarse fácilmente. JSON cumple con este requisito, sin las vulnerabilidades graves mencionadas anteriormente.

johnm
fuente
-3

Pruebe el siguiente código para analizar su respuesta php json: read.php

<script
  src="https://code.jquery.com/jquery-3.2.1.min.js"
  integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="
  crossorigin="anonymous"></script>
<script type="text/javascript">  
$.ajax({
    url:'index.php',
    data:{},
    type:"POST",
    success:function(result) {
        jsondecoded = $.parseJSON(result);
        $.each(jsondecoded, function(index, value) {
            $("#servers").text($("#servers").text() + " " + value.servername);
            console.log(value.start);
            console.log(value.end);
            console.log(value.id);
        });
    },
    statusCode: {
    404: function() {
      alert( "page not found" );
    }
  }
});
</script>

server.php

<?php 
echo '[{"start":"2017-08-29","end":"2017-09-01","id":"22"},{"start":"2017-09-03","end":"2017-09-06","id":"23"}]';
?>
amit rawat
fuente
Si bien este código puede responder la pregunta, proporcionar un contexto adicional con respecto a cómo y / o por qué resuelve el problema mejoraría el valor a largo plazo de la respuesta.
Nic3500