Supprime les balises HTML et PHP d'une chaîne
Analyse syntaxique des données JSON en JavaScript
Une utilisation courante de JSON consiste à échanger des données vers/depuis un serveur web.
Lorsque vous recevez des données d'un serveur Web sous format json, les données sont toujours une chaîne de caractères.
En analysant les données avec JSON.parse(), les données deviennent un objet JavaScript.
En JavaScript, vous pouvez facilement analyser les données JSON reçues du serveur Web à l'aide de la méthode JSON.parse(). Cette méthode analyse une chaîne JSON et construit la valeur ou l'objet JavaScript décrit par la chaîne. Si la chaîne donnée n'est pas un JSON valide, vous obtiendrez une erreur de syntaxe.JSON.parse()
Supposons que nous ayons reçu la chaîne codée JSON suivante d'un serveur Web :
{"titre": "L'Étranger", "auteur": "Albert Camus", "année": "1942", "pays": "France"}
Nous pouvons simplement utiliser la méthode JavaScript parse() pour convertir cette chaîne JSON en un objet JavaScript et accéder aux valeurs individuelles en utilisant JSON.parse().
JSON ici est une variable où en va stocker la chaine json.
Exemple : Copier le code
<!DOCTYPE html>
<html>
<head>
<title>Création d’un objet à partir d’une chaîne JSON</title>
</head>
<body>
<h1>Création d’un objet à partir d’une chaîne JSON</h1>
<p id="exemple"></p>
<script>
var livre = '{"titre": "L\'Étranger", "auteur": "Albert Camus", "année": "1942", "pays": "France"}'
var objLivre = JSON.parse(livre);
document.getElementById("exemple").innerHTML ="Titre: "+ objLivre.titre + "<br> Auteur: " + objLivre.auteur +"<br>Année: " + objLivre.année;
</script>
</body>
</html>
Analyse des données JSON imbriquées en JavaScript : Tableau comme JSON
Les objets et tableaux JSON peuvent également être imbriqués. Un objet JSON peut arbitrairement contenir d'autres objets JSON, des tableaux, des tableaux imbriqués, des tableaux d'objets JSON, et ainsi de suite.
Lorsque vous utilisez la méthode JSON.parse() sur un JSON dérivé d'un tableau, la méthode renvoie un tableau JavaScript, au lieu d'un objet JavaScript.
L'exemple montre comment analyser un objet JSON imbriqué et en extraire toutes les valeurs en JavaScript.
Exemple : Copier le code
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Parse Nested JSON Data in JavaScript</title>
</head>
<body>
<script>
/* Stocker une chaîne JSON de plusieurs lignes dans une variable JS
en utilisant les nouveaux littéraux de modèle ES6 */
var livre = `{
"book" : {
"nom" : "Harry Potter et la Coupe de Feu",
"auteur" : "J. K. Rowling",
"année" : 2000,
"personnages" : ["Harry Potter", "Hermione Granger", "Ron Weasley"],
"genre" : "Fantasy Fiction",
"prix" : {
"livre de poche" : "10,40 $", " couverture rigide" : "20,32 $", "E-book" : "$4.11"
}
}
}` ;
// Conversion d'un objet JSON en objet JS
var objLivre = JSON.parse(livre);
// Définir une fonction récursive pour imprimer les valeurs imbriquées
function printValues(obj) {
for(var k in obj) {
if(obj[k] instanceof Object) {
printValues(obj[k]);
} else {
document.write(k +": "+ obj[k] + "<br>");
};
}
};
// Impression de toutes les valeurs de l'objet résultant
printValues(objLivre);
document.write("<hr>");
// Impression d'une seule valeur
document.write(objLivre["book"]["auteur"] + "<br>");
document.write(objLivre["book"]["personnages"][0] + "<br>");
document.write(objLivre["book"]["prix"][" couverture rigide"]);
</script>
</body>
</html>
Exceptions : Analyse des dates dans JSON
Les objets date ne sont pas autorisés dans JSON.
Si vous devez inclure une date, écrivez-la sous forme de chaîne.
Vous pourrez la reconvertir en objet date ultérieurement .
Exemple : Copier le code
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Parse Nested JSON Data in JavaScript</title>
</head>
<body>
<h2>Convertit une chaîne de caractères en un objet date.</h2>
<p id="exemple"></p>
<script>
const text = '{"nom" : "Victor Hugo", "naissance" : "1802-2-26", "ville" : "Besançon"}';
const obj = JSON.parse(text);
//Création d'une fonction pour formater la date
function formatDate(date) {
var monthNames = [
"Janvier", "Février", "Mas",
"Avril", "Mai", "Juin", "Juillet",
"Aout", "Septembre", "Octobre",
"Novembre", "Décembre"
];
var day = date.getDate();
var monthIndex = date.getMonth();
var year = date.getFullYear();
return day + ' ' + monthNames[monthIndex] + ' ' + year;
}
// conversion de la chaine de caractères en date
date = new Date(obj.naissance);
// Formater la date
obj.naissance=formatDate(date)
document.getElementById("exemple").innerHTML = "Nom: "+obj.nom + "<br>Date de naissance: " + obj.naissance + "<br>Lieu de naissance : "+ obj.ville;
</script>
</body>
</html>
Vous pouvez aussi utiliser le deuxième paramètre de la fonction JSON.parse(), appelé reviver. Le paramètre reviver est une fonction qui vérifie chaque propriété, avant de renvoyer la valeur.
<!DOCTYPE html>
<html>
<body>
<h2>Convertit une chaîne de caractères en un objet date.</h2>
<p id="exemple"></p>
<script>
const text = '{"nom":"John", "naissance":"1986-12-14", "ville":"New York"}';
const obj = JSON.parse(text, function (key, value) {
if (key == "naissance") {
return new Date(value);
} else {
return value;
}
});
document.getElementById("exemple").innerHTML = obj.nom + ", " + obj.naissance;
</script>
</body>
</html>