[Résolu] Afficher un objet JSON

Bonjour à tous
J'ai un programme qui crée un objet JSON relativement complexe.
Avant d'envoyer cet objet à une routine du serveur qui écrira cet objet dans un fichier .json sur le site, je voudrais afficher l'objet sous la même forme qu'utilisent les navigateurs pour afficher un fichier .json et demander l'accord de l'utilisateur.
Ce ne sont pas les solutions qui manquent mais j'aimerais vos conseils sur la façon la plus économique de faire ça.
Merci pour votre aide.

function ObjectToNode(data) {
	let dataNode;
	if(typeof data === 'object') {
		if(Array.isArray(data)) {
			dataNode = newNode('ul', '.array');
			for(const item in data) {
				const itemNode = ObjectToNode(item);
				itemNode.classList.add('item');
				dataNode.appendChild(newNode('li', itemNode));
			}
		}
		else {
			dataNode = newNode('ul', '.object');
			for(const [name, value] of Object.entries(data)) {
				const nameNode = newNode('p', '.objectName', name);
				const valueNode = ObjectToNode(value);
				valueNode.classList.add('objectValue');
				const namedNode = newNode('div', '.object', nameNode, valueNode);
				dataNode.appendChild(newNode('li', namedNode));
			}
		}
	}
	else dataNode = newNode('p', data);
	return dataNode;
}

newNode() est une fonction qui simplement fait un document.create() et y ajoute les attributs et le contenu.
Je suppose que toutes les librairies js contiennent une fonction de ce genre, simplement j'ai créé cette fonction avant qu'il existe de telles librairies et je n'ai pas envie de les utiliser.

Voici ce que ça donne :


La difficulté que j'ai rencontrée est que si au lieu d'écrire

let dataNode;
if(...) dataNode = ...;
else dataNode = ...;

on écrit

if(...) const dataNode = ...;
else const dataNode = ...;

ça ne marche pas sans message d'erreur apparent. Simplement ça ne génère pas ce que l'on veut.
Je pensais que, comme un seul des const dataNode est exécuté ça ne posait pas de problème, mais ce n'est pas comme ça que ça marche.
Modifié par PapyJP (09 May 2023 - 16:24)

PapyJP a écrit :

Voici ce que ça donne :
upload/1683641902-48769-bjecttonode.png

Ah ok, tu fais un rendu un peu plus jolie que juste l'affichage du json en fait , je pensais que tu voulais juste afficher le json sur plusieurs lignes au lieu d'une seul pour qu'il soit un peu plus lisible.

PapyJP a écrit :

La difficulté que j'ai rencontrée est que si au lieu d'écrire

let dataNode;
if(...) dataNode = ...;
else dataNode = ...;

on écrit

if(...) const dataNode = ...;
else const dataNode = ...;

ça ne marche pas sans message d'erreur apparent. Simplement ça ne génère pas ce que l'on veut.
Je pensais que, comme un seul des const dataNode est exécuté ça ne posait pas de problème, mais ce n'est pas comme ça que ça marche.

Pour ce problème je suppose que cela devait être lié à un problème de portée de variable, let et const n'existent qu'au sein du sous bloc mais généralement cela retourne un message d'erreur pour indiqué que l'on accède à un element non déclare si on essaye de s'en servir en dehors ..

Désolé de répondre aussi tard.
Si, au lieu de

[if(…) const dataNode =….,

On écrivait

if(…) {const dataNode = …}

on prendrait mieux conscience que const dataNode n’a comme portée que le bloc que constitue à elle seule cette instruction.
Donc utiliser dataNode plus loin n’a pas de sens.
CQFD
Modifié par PapyJP (13 May 2023 - 08:10)

Bonjour,

Dans le code :

let a=true, b=1;
if(a) const c = b;

en plus du fait que c ne sera pas utilisable après pour une question de visibilité de variable, il y aura une erreur de syntaxe, car il n'est pas permis d'utiliser un const (ou un let) dans un bloc ne contenant qu'une seule ligne non entourée par des accolades.

Et même si cela avait été permis syntaxiquement, cela aurait été probablement inutile, puisque la variable ne pourrait pas être ensuite utilisée ni dans le bloc où elle est déclaré puisqu'un tel bloc sans accolades ne peut avoir qu'une seule ligne, ni ailleurs pour des raisons de portée de variable. Et c'est probablement pour ça qu'il est interdit du point de vue syntaxique de mettre un const dans un bloc n'ayant qu'une seule ligne non entourée d'accolades.

Amicalement,
Modifié par parsimonhi (13 May 2023 - 12:48)