JSOn to JS: Eval?

**lekunfry** · 30/07/2007, 11h30

Quel est le problem dans ce code qui est censé récupéré le json, en faire un objet javascript et en faire un affichage ?

Code JavaScript :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
// Example Objet en json
var TestlinkJson = {"id_source":"7315f47dba65515fca60c851d7065bc6","url_source":"http:\/\/news.yahoo.com\/s\/afp\/20060822\/od_afp\/chinacateringcultureoffbeat_060822074830","title_source":"Jail-theme teahouse becomes prisoner of own success in China - Yahoo! News","smartlinks_infos":[{"id_dest":"75effc69e8c68b389c65c67119463312","score":"126","deleted":"0","date":"1164279208","zone_cible":"151","manually_added":"0","url_dest":"http:\/\/news.yahoo.com\/s\/afp\/20060825\/od_afp\/malaysiahealthtoilets_060825160532","title_dest":"Malaysia calls for \"toilet revolution\" - Yahoo! News"}]} 
 
//fonction de construction de SmartLinks
function TestLink(url_source,title_source,id_source)
{
	this.url_source = url_source; //l'url du document source du SmartLinks
	this.title_source = title_source; // titre du doc source du SmartLinks
	this.id_source = id_source; //l'id de la source du SmartLinks
	this.smartlinks_info = new array; //tableau de liens cible avec info sur la zone, la date etc...
 
 
}
 
var TestLink = eval('(' + TestlinkJson + ')');
 
alert(TestLink);

**FremyCompany** · 30/07/2007, 15h12

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
// Example Objet en json
var TestlinkJson = {"id_source":"7315f47dba65515fca60c851d7065bc6","url_source":"http:\/\/news.yahoo.com\/s\/afp\/20060822\/od_afp\/chinacateringcultureoffbeat_060822074830","title_source":"Jail-theme teahouse becomes prisoner of own success in China - Yahoo! News","smartlinks_infos":[{"id_dest":"75effc69e8c68b389c65c67119463312","score":"126","deleted":"0","date":"1164279208","zone_cible":"151","manually_added":"0","url_dest":"http:\/\/news.yahoo.com\/s\/afp\/20060825\/od_afp\/malaysiahealthtoilets_060825160532","title_dest":"Malaysia calls for \"toilet revolution\" - Yahoo! News"}]}

Ce code génère déjà un objet...

**lekunfry** · 30/07/2007, 22h14

Envoyé par FremyCompany

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
// Example Objet en json
var TestlinkJson = {"id_source":"7315f47dba65515fca60c851d7065bc6","url_source":"http:\/\/news.yahoo.com\/s\/afp\/20060822\/od_afp\/chinacateringcultureoffbeat_060822074830","title_source":"Jail-theme teahouse becomes prisoner of own success in China - Yahoo! News","smartlinks_infos":[{"id_dest":"75effc69e8c68b389c65c67119463312","score":"126","deleted":"0","date":"1164279208","zone_cible":"151","manually_added":"0","url_dest":"http:\/\/news.yahoo.com\/s\/afp\/20060825\/od_afp\/malaysiahealthtoilets_060825160532","title_dest":"Malaysia calls for \"toilet revolution\" - Yahoo! News"}]}

Ce code génère déjà un objet...

certes mais il m'est demandé d'utiliser l'autre structure avant d'afficher

**FremyCompany** · 31/07/2007, 07h47

Bon, pour résumer, ton objet "testJSONLink" c'est déjà la valeur que tu voulais attribuer à testLink

Il possède déjà les propriétés "id_source", ...

Pour faire ce que tu veux faire, tu dois transformer en String le tout

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
// Example Objet en json
var TestlinkJson = '{"id_source":"7315f47dba65515fca60c851d7065bc6","url_source":"http:\/\/news.yahoo.com\/s\/afp\/20060822\/od_afp\/chinacateringcultureoffbeat_060822074830","title_source":"Jail-theme teahouse becomes prisoner of own success in China - Yahoo! News","smartlinks_infos":[{"id_dest":"75effc69e8c68b389c65c67119463312","score":"126","deleted":"0","date":"1164279208","zone_cible":"151","manually_added":"0","url_dest":"http:\/\/news.yahoo.com\/s\/afp\/20060825\/od_afp\/malaysiahealthtoilets_060825160532","title_dest":"Malaysia calls for \"toilet revolution\" - Yahoo! News"}]}';

Mais ca n'a aucun intérêt

eval est remplacé par le code qu'il recoit donc si tu fais

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

var x = eval("true")

c'est parfaitement identique à

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

var x = true

sauf que ca prend plus de temps...

**lekunfry** · 31/07/2007, 12h00

Envoyé par FremyCompany

Bon, pour résumer, ton objet "testJSONLink" c'est déjà la valeur que tu voulais attribuer à testLink

Il possède déjà les propriétés "id_source", ...

Pour faire ce que tu veux faire, tu dois transformer en String le tout

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
// Example Objet en json
var TestlinkJson = '{"id_source":"7315f47dba65515fca60c851d7065bc6","url_source":"http:\/\/news.yahoo.com\/s\/afp\/20060822\/od_afp\/chinacateringcultureoffbeat_060822074830","title_source":"Jail-theme teahouse becomes prisoner of own success in China - Yahoo! News","smartlinks_infos":[{"id_dest":"75effc69e8c68b389c65c67119463312","score":"126","deleted":"0","date":"1164279208","zone_cible":"151","manually_added":"0","url_dest":"http:\/\/news.yahoo.com\/s\/afp\/20060825\/od_afp\/malaysiahealthtoilets_060825160532","title_dest":"Malaysia calls for \"toilet revolution\" - Yahoo! News"}]}';

Mais ca n'a aucun intérêt

eval est remplacé par le code qu'il recoit donc si tu fais

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

var x = eval("true")

c'est parfaitement identique à

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

var x = true

sauf que ca prend plus de temps...

Voila ma solution dis moi ce que tu en penses

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
// Example Objet en json
var TestlinkJson = {"id_source":"7315f47dba65515fca60c851d7065bc6","url_source":"http:\/\/news.yahoo.com\/s\/afp\/20060822\/od_afp\/chinacateringcultureoffbeat_060822074830","title_source":"Jail-theme teahouse becomes prisoner of own success in China - Yahoo! News","smartlinks_infos":[{"id_dest":"75effc69e8c68b389c65c67119463312","score":"126","deleted":"0","date":"1164279208","zone_cible":"151","manually_added":"0","url_dest":"http:\/\/news.yahoo.com\/s\/afp\/20060825\/od_afp\/malaysiahealthtoilets_060825160532","title_dest":"Malaysia calls for \"toilet revolution\" - Yahoo! News"}]} 
 
//fonction de construction de SmartLinks
// notice we're now using JSON as the init data
function TestLink(json_init)
{
	// init data is used from the init object, e.g. json_init.property
	this.url_source = json_init.url_source; //l'url du document source du SmartLinks
	this.title_source = json_init.title_source; // titre du doc source du SmartLinks
	this.id_source = json_init.id_source; //l'id de la source du SmartLinks
	// notice Array() -- you need to use the proper constructor 
	// to actually create an array
	this.smartlinks_info = new Array(); //tableau de liens cible avec info sur la zone, la date etc...
 
 
}
 
// note I changed the name of the instance var to avoid confusion
var testLinkInstance = new TestLink(TestlinkJson);
 
// this will alert saying '[Object]' or something similar, 
// since you are attempting to alert with an entire object
alert(testLinkInstance.title_source);

**FremyCompany** · 31/07/2007, 14h54

Ca me semble bon

**lekunfry** · 02/08/2007, 13h41

Voila ou j'en suis dans ma quete de l'affichage de mon objet js!

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
<script type="text/javascript">
//Muck Up JSON object juste pour voir si notre et notre fonction fonctionne bien!
var SmartLinklinkJson = {"id_source":"7315f47dba65515fca60c851d7065bc6","url_source":"http:\/\/news.yahoo.com\/s\/afp\/20060822\/od_afp\/chinacateringcultureoffbeat_060822074830","title_source":"Jail-theme teahouse becomes prisoner of own success in China - Yahoo! News","smartlinks_infos":[{"id_dest":"75effc69e8c68b389c65c67119463312","score":"126","deleted":"0"," dat e":"1164279208","zone_cible":"151","manually_added":"0","url_dest":"http:\/\/news.yahoo.com\/s\/afp\/20060825\/od_afp\/malaysiahealthtoilets_060825160532","title_dest":"Malaysia calls for \"toilet revolution\" - Yahoo! News"}]};
 
// La fonction eval crée un objet JS à partir d'un string json qui sera affiché et utilisé pour traitements ultérieurs!
var SmartLink = eval(SmartLinklinkJson); 
 
//alert(SmartLink.smartlinks_infos[0].id_dest);
 
// la fonction d'affichage récupere l'objet smartlinks comme élément du DOM
function affichage(){
var afficheur=document.getElementById('Smartlinks'); 
 
// Création d'un tableau avec toutes les propriétés du SmartLinks
var Props=new Array('id_source', 'url_source', 'title_source', 'smartlinks_infos')
 
//Création du Tableau en DOM
var tableauSL=document.createElement('table')
var slBody=document.createElement('tbody')
 
//Boucle qui parcour l'ensemble de l'objet smartlinks afin d'afficher ses propriétés dans le tableau créé
for (i=0;i<Props.length;i++){
 
//Création d'un élément TR dans le DOM, correspondant à 1 objet SmartLinks
var smartlinksline=document.createElement('tr')
 
//Boucle de remplissage des deux cellules de la TR créée
for(j=0;j<2;j++){
var cellule=document.createElement('td')
cellule.innerHTML=(j==0)?Props[i]:SmartLink[Props[i]];
smartlinksline.appendChild(cellule)
}
slBody.appendChild(smartlinksline)
}
tableauSL.appendChild(slBody)
document.body.appendChild(tableauSL)
}
</script>
</head>
<body onload="displaySmartLinks()">
<div id_source='1' url_source='2' title_source='3' smartlinks_infos='4' id='Smartlinks'>
Le test smartlink en affichage brut et sans complex!
</div>
</body>
 
</html>

j'arrive pas à comprendre pourquoi je n'arrive pas à obtenir ceci!

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
 
<table>
<tr>
<td>
Title_Source <br />
URL_Source<br />
</td>
<td>
smartlinks_info[0].id_dest <br />
smartlinks_info[0].url_dest</br />
</td>
</tr>
<table>

**JulienC** · 06/08/2007, 10h35

Je crois toujours que tu t'emmêle les pinceaux au niveau du JSON.
Le format JSON a comme intérêt de pouvoir avec une notation simple enregistrer des infos plus complexes (Objets, tableaux, etc...), ça apparemment, tu gère (le JSON que tu as écrit est bien).
L'autre intérêt est de pouvoir le traiter aussi simplement en JS à l'aide de eval() (C'est là que les problèmes commencent pour toi

).

Exemple :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

{'test': 'toto'}

= JSON

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

"{'test': 'toto'}"

= String

Pour passer du string à un objet, utilises eval().

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

var obj = eval("{'test': 'toto'}");

obj est maintenant un objet JS. Tu peux utiliser ces attributs, tel obj.test (qui donne 'toto').
Rien ne t'empêche de lui ajouter des attributs ou des méthodes :
obj.id = 1234;
ou
obj.display = function() { ... }

Si tu as bien suivi, soit tu utilises :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

var SmartLink = {"id_source":"7315f47dba65515fca60c851d7065bc6","url_source":"http:\/\/news.yahoo.com\/s\/afp\/20060822\/od_afp\/chinacateringcultureoffbeat_060822074830","title_source":"Jail-theme teahouse becomes prisoner of own success in China - Yahoo! News","smartlinks_infos":[{"id_dest":"75effc69e8c68b389c65c67119463312","score":"126","deleted":"0"," dat e":"1164279208","zone_cible":"151","manually_added":"0","url_dest":"http:\/\/news.yahoo.com\/s\/afp\/20060825\/od_afp\/malaysiahealthtoilets_060825160532","title_dest":"Malaysia calls for \"toilet revolution\" - Yahoo! News"}]};

soit (notes la présence des guillemets) :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
//Muck Up JSON object juste pour voir si notre et notre fonction fonctionne bien!
var SmartLinklinkJson = "{'id_source':'7315f47dba65515fca60c851d7065bc6','url_source':'http:\/\/news.yahoo.com\/s\/afp\/20060822\/od_afp\/chinacateringcultureoffbeat_060822074830','title_source':'Jail-theme teahouse becomes prisoner of own success in China - Yahoo! News','smartlinks_infos':[{'id_dest':'75effc69e8c68b389c65c67119463312','score':'126','deleted':'0',' dat e':'1164279208','zone_cible':'151','manually_added':'0','url_dest':'http:\/\/news.yahoo.com\/s\/afp\/20060825\/od_afp\/malaysiahealthtoilets_060825160532','title_dest':'Malaysia calls for \"toilet revolution\" - Yahoo! News'}]}";
 
// La fonction eval crée un objet JS à partir d'un string json qui sera affiché et utilisé pour traitements ultérieurs!
var SmartLink = eval(SmartLinklinkJson);

mais surtout pas :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
//Muck Up JSON object juste pour voir si notre et notre fonction fonctionne bien!
var SmartLinklinkJson = {"id_source":"7315f47dba65515fca60c851d7065bc6","url_source":"http:\/\/news.yahoo.com\/s\/afp\/20060822\/od_afp\/chinacateringcultureoffbeat_060822074830","title_source":"Jail-theme teahouse becomes prisoner of own success in China - Yahoo! News","smartlinks_infos":[{"id_dest":"75effc69e8c68b389c65c67119463312","score":"126","deleted":"0"," dat e":"1164279208","zone_cible":"151","manually_added":"0","url_dest":"http:\/\/news.yahoo.com\/s\/afp\/20060825\/od_afp\/malaysiahealthtoilets_060825160532","title_dest":"Malaysia calls for \"toilet revolution\" - Yahoo! News"}]};
 
// La fonction eval crée un objet JS à partir d'un string json qui sera affiché et utilisé pour traitements ultérieurs!
var SmartLink = eval(SmartLinklinkJson);

qui ne donnera absolument rien !

PS : juste pour info, innerHTML n'est pas conforme aux standards (il "pourrait" poser problèmes sur certains navigateurs, comme Opéra), il vaut mieux utiliser document.createTextNode(). Maintenant, si ce n'est que pour du texte, ça doit passer partout !

JSOn to JS: Eval?

JavaScript

Vue hybride

Discussions similaires

Partager

Partager