jQuery.ajax gibt leeres Array zurück

Question

Ich lerne gerade APIs zu verwenden. Ich erhalte Daten von meinem Github Repo. Ich versuche, dass das Skript die JSON-Informationen in die Variable githubData lädt. Wenn ich jedoch die Variable githubData für die Konsole protokolliere, wird ein leeres Array zurückgegeben. Wenn ich jedoch nach dem Laden der Seite eine neue Variable mit exakt derselben Funktion erstelle, funktioniert das Skript genau so, wie es sein sollte. Wenn die Seite geladen wird, werden die eigentlichen Daten nicht geladen. Es lädt ein leeres Array. Ich weiß, dass die Funktion asynchron ist, also wie würde ich gehen, um das Array nicht leer zu sein, wenn ich die Seite lade? Hier ist mein Code:

var githubAPI = 'https://api.github.com/repos/zacharysohovich/ticTacToe/readme'; 
var items = {}; 
jQuery.ajax({ 
    url: githubAPI, 
    contentType: 'application/json; charset=utf-8', 
    success: function(resultData) { 
    $.each(resultData, function(key,val) { 
     items[key] = val; 
    }); 
    } 
}); 
var githubData = $.map(items,function(k,v) { 
    return ("<p>" + k + ": " + v + "</p>"); 
}); 

Answer 1

Das Problem ist, dass sein ein asynchroner Aufruf was bedeutet, dass, sobald es die Anforderung feuert sie auf das nächste Stück Code geht. Sobald es zu githubData-Elementen gelangt, ist es immer noch ein leeres Objekt, da die API-Antwort noch nicht empfangen wurde. würde ich die githubData Variable direkt unter var items = {} wie so

var items = {} var githubData; und dann in den Erfolg instanziiert: Funktion, nachdem Sie die $ tun .each können Sie die

githubData = $.map(items,function(k,v) { return ("<p>" + k + ": " + v + "</p>"); });

dies, dass die gewährleistet, stellen Der api-Aufruf wurde beendet und die Elemente sollten etwas enthalten, solange die Antwort mit etwas zurückkam.