JavaScript/jQuery JSON Array Ausgabe - Werte als undefiniert

Question

Ich ziehe Daten aus einer JSON-Datei:

[ 
{ 
    "video": "video/preroll" 
}, 
{ 
    "video": "video/areyoupopular" 
}, 
{ 
    "video": "video/destinationearth" 
}] 

ich eine console.log in verschiedenen Stadien versucht haben und haben kein Problem, bis ich Geh auf die Bühne unten. Ich brauche die Werte für jedes Video in der JSON-Zeichenfolge und lege sie in ein Array namens Playlist. Der Code Ich verwende ist:

$(function() { 
    var playlist = []; 

    var url = "http://localhost/class_files2/week7.1/video-data.json"; 

    $.get(url, function(data) { 
     // console.log(data); at this point returns the JSON string as expected. 
     for (var i=0; i<data.length; i++) { 
      playlist.push(data[i].video); 
     } 
     console.log(playlist); 
    }); 
}); 

Das Array zeigt, aber mit mehreren undefinierten Werten (siehe Screenshot). array error

Ich sollte die Videowerte in die Wiedergabeliste Array bekommen. Ich habe Hilfe von jemand anderem bekommen, der die Werte mit meinen gleichen Dateien wie erwartet in das Playlist-Array verschoben hat.

Wenn ich die console.log vor dem Push in das Array setzen, bekomme ich die JSON-Zeichenfolge, aber es ist 156 Mal durchlaufen (siehe Screenshot). array 156

Ich habe versucht, neue Dateien zu erstellen und neu zu tippen (nicht kopieren und einfügen). Ich habe versucht, die vollständige AJAX GET-Methode zu verwenden. Ich bin sicher, es ist etwas mit meiner Aussage, aber alles scheint richtig. Ich hatte Hilfe mit jemand anderem gesucht, aber sie bekommen das Array wie erwartet (zweiter Screenshot) ohne ein Problem. Ich verwende XAMPP für OS X 1.8.3-4 MacBook Pro (Retina, 13-Zoll, Ende 2013) OSX El Capitan 10.11.4 Der gleiche Fehler tritt in Chrome, Firefox und Safari.

Was könnte möglicherweise das Problem sein? Es ist besonders merkwürdig, da die gleichen Dateien auf einem anderen Computer zu funktionieren scheinen, es sei denn, es gibt eine andere Variable, die nicht berücksichtigt wird.

Answer 1

Vermeiden Sie die Verwendung von for-Schleife mit Liste/Arrays. Verwenden Sie forEach Schleife.

Versuchen Sie dies.

$.get(url, function(data) { 
    // console.log(data); at this point returns the JSON string as expected. 
    data = JSON.parse(data); 
    data.forEach(function(item) { 
     playlist.push(item.video); 
    }); 
    console.log(playlist); 
});