oujood.com

Les objets JSON. Créer Object JSON avec JavaScrip

Les objets JSON peuvent être créés avec JavaScript. Voyons les différentes façons de créer des objets JSON en utilisant JavaScript
Les objets JSON peuvent être créés entre autres programmes avec JavaScript. Voyons les différentes façons de créer des objets JSON en utilisant JavaScript

chercher |

Les caractères littéraux des objets JSON

Les littéraux des objets JSON sont entourés d'accolades {}.
Les littéraux d'objets JSON contiennent des paires clé/valeur.
Les clés et les valeurs sont séparées par deux points.
Les clés doivent être des chaînes de caractères et les valeurs doivent être un type de données JSON valide :
chaîne de caractères

  • nombre
  • objet
  • tableau
  • booléen
  • null

Chaque paire clé/valeur est séparée par une virgule.

lamp C'est une erreur courante d'appeler un objet JSON littéral "un objet JSON".
JSON ne peut pas être un objet. JSON est un format de chaîne de caractères.
Les données ne sont JSON que lorsqu'elles sont dans un format de chaîne bien definit.
Lorsqu'elles sont converties en variable JavaScript, alors elles deviennent des objets JavaScript.

Création d'objets simples

Les objets JSON peuvent être créés avec JavaScript. Voyons les différentes façons de créer des objets JSON à l'aide de JavaScript. - Création d'un objet vide var JSONObj = {} ; - Création d'un nouvel objet var JSONObj = new Object() ; - Création d'un objet avec l'attribut bookname dont la valeur est une chaîne de caractères et l'attribut prix dont la valeur est numérique.
L'accès à l'attribut se fait en utilisant l'opérateur point '.'.
- var JSONObj = { "bookname " : "Guide PHP", "prix":100 } ;

Voici un exemple qui montre la création d'un objet en javascript en utilisant JSON, metez dans le code un fichier html sous le nom de json_object.html .

Exemple :       Copier le code

<html>
<head>
<title>Créer Object JSON avec JavaScript</title>
<script language = "javascript" >
 var JSONObj = { "name" : "oujood.com", "year"  : 2009 };

 document.write("<h1>Exemple JSON avec JavaScript </h1>");
 document.write("<br>");
 document.write("<h3>Website Nom = "+JSONObj.name+"</h3>");  
 document.write("<h3>Année = "+JSONObj.year+"</h3>");  
</script>
</head>

<body>
</body>	
</html>

Création d'objets de type tableau

L'exemple suivant montre la création d'un objet de type tableau en javascript en utilisant JSON. Enregistrez le code sous le nom de json_array_objet.html.

Exemple :       Copier le code

<html>
<head>
<title>Creation of array object in javascript using JSON</title>
<script language = "javascript" >
 document.writeln("<h2>JSON array object</h2>");
 var books = { "Pascal" : [ 
	{ "Name"  : "Pascal en toute simplicité", "price" : 679 },
	{ "Name"  : "Guide de Pascal", "price" : 299 }],  
		
	"Scala"  : [
	   { "Name"  : "Le logiciel Scala pour les impatients", "price" : 999 }, 
	   { "Name"  : "Scala en Depth", "price" : 1199 }]    
 }    
 var i = 0
 document.writeln("<table border = '2'><tr>");
	
 for(i = 0;i<books.Pascal.length;i++) {	
	document.writeln("<td>");
	document.writeln("<table border = '1' width = 100 >");
	document.writeln("<tr><td><b>Nom</b></td><td width = 50>" + books.Pascal[i].Name+"</td></tr>");
	document.writeln("<tr><td><b>Prix</b></td><td width = 50>" + books.Pascal[i].price +"</td></tr>");
	document.writeln("</table>");
	document.writeln("</td>");
 }

 for(i = 0;i<books.Scala.length;i++) {
	document.writeln("<td>");
	document.writeln("<table border = '1' width = 100 >");
	document.writeln("<tr><td><b>Nom</b></td><td width = 50>" + books.Scala[i].Name+"</td></tr>");
	document.writeln("<tr><td><b>Prix</b></td><td width = 50>" + books.Scala[i].price+"</td></tr>");
	document.writeln("</table>");
	document.writeln("</td>");
 }
	
 document.writeln("</tr></table>");
</script>
</head>

<body>
</body>
</html>

Boucle sur un objet

Vous pouvez parcourir les propriétés d'un objet à l'aide d'une boucle for-in. Le code dans l'exemple renvoie les clés de l'objet json.

Exemple :       Copier le code

<html>
<body>

<h2>Propriétés des objets de bouclage</h2>
<p id="demo"></p>

<script>
const myJSON = '{"name":"John", "age":45, "car":null}';
const myObj = JSON.parse(myJSON);

let text = "";
for (const x in myObj) {
  text += x + ", ";
}
document.getElementById("demo").innerHTML = text;
</script>

</body>
</html>

Alors que cet exemple renvoie les valeurs de l'objet json

  Copier le code

<html>
<body>

<h2>Bouclage sur les valeurs des objets JavaScript</h2>
<p id="demo"></p>

<script>
const myJSON = '{"name":"John", "age":30, "car":null}';
const myObj = JSON.parse(myJSON);
let text = "";
for (const x in myObj) {
  text += myObj[x] + ", ";
}
document.getElementById("demo").innerHTML = text;
</script>

</body>
</html>

Par carabde 2 novembre 2021



Voir aussi nos tutoriel :

fprintf, fprintf

écrit une chaîne format e dans un flux

Balise figure

Spécifie autonome le contenu

fonction wordwrap, wordwrap

Effectue la c sure d'une chaîne