données Assigner de jQuery getJSON à tableau

Question

Comment attribuez-vous les données récupérées via getJSON() à un tableau, pour une utilisation ultérieure?

L'URL getJSON ci-dessous récupère correctement formaté JSON avec 10 éléments principaux, chacun ayant des sous-éléments d'identification, le nom d'utilisateur, haiku (et d'autres). Si vous l'exécutez, essayez d'enregistrer les éléments JSON dans un fichier local, afin que vous n'obtiendrez pas la même erreur de domaine (c'est-à-dire que JSON ne se chargera pas si vous récupérez un autre domaine).

Ce qui se passe, c'est que l'alerte va chercher une valeur dans le rappel getJSON, mais à l'extérieur, la valeur est indéfinie.

 

$(document).ready(function(){ 
    var haikus=[]; 
    alert("begin loop"); 
    $.getJSON('http://example.com/json.php',function(data){ 
     var i=0; 
     for(i=0;i<data.length;i++){ 
      haikus[i]=[data[i].id,String(data[i].username),String(data[i].haiku)]; 
     } 
      alert(haikus[0][1]); 
    }); 
}) 
 

• Oui, cela est lié à un post précédent. Mais, au départ, j'avais trop simplifié mon problème, donc les solutions initiales fournies ne l'ont pas résolu. jQuery - getJSON data to array

Answer 1

Votre problème est que tout code extérieur (et après) la $.getJSON demande a déjà couru au moment où la réponse $.getJSON est reçue.

Rappelez-vous que les appels AJAX sont asynchrones. Cela signifie que le code suivant la requête AJAX n'attend pas la réponse à exécuter. Cela dure donc longtemps avant qu'il y ait une réponse.

L'essentiel est que tout code qui repose sur la réponse à partir d'une requête AJAX asynchrone, il faut exécuter (ou être appelé à partir) à l'intérieur de la fonction de rappel.

---

EDIT:

Pour clarifier les choses, dans l'exemple de code ci-dessous, s'il vous plaît voir les commentaires du code. Cela devrait aider à expliquer le problème.

$(document).ready(function(){ 
    var haikus=[]; 
    alert("begin loop"); 
    $.getJSON('http://haikuennui.com/random.php',function(data){ 
     var i=0; 
     for(i=0;i<data.length;i++){ 
      haikus[i]=[data[i].id,String(data[i].username),String(data[i].haiku)]; 
     } 
       // The data in haikus is available here becuase 
       // this alert() doesn't run until the response is received. 
      alert(haikus[0][1]); 
    }); 

     // Here the data in haikus is NOT available because this line 
     //  of code will run ***before*** the response from the AJAX 
     //  request from above is received. 
     // In other words, this alert() executes **immediately** without 
     //  waiting for the $.getJSON() to receive its response. 
    alert(haikus[0][1]); 

}); 

Answer 2

Je crois que si vous définissez une variable en utilisant « var haïkus = quelque chose », la variable est de portée locale, et si vous définissez la variable en utilisant « haïkus = quelque chose », il est de portée mondiale.