予期しないキャッチしないTypeError

Question

このコードは、jQueryファイルの後にindex.htmlからリンクされた外部ファイルtest.jsです。ライン20上の

Uncaught TypeError: Cannot read property 'starshipName' of undefined

、私は、配列内の最初の項目のstarshipNameプロパティを警告しよう： 私は私のブラウザを更新し、コンソールに行くとき、私は、このエラーメッセージが表示されます。

var starships = []; 

function starship(starshipName, model, manufacturer) { 
    this.starshipName = starshipName; 
    this.model = model; 
    this.manufacturer = manufacturer; 
} 

function starshipData(data) { 
    for (i = 0; i < data.results.length; i++) { 
    var results = data.results[i]; 
    starships.push(new starship(results["name"], results["model"], results["manufacturer"])); 
    } 
} 

$.getJSON('https://swapi.co/api/starships/', function(data) { 
    starshipData(data); 
}); 

alert(starships[0].starshipName); 

私は、コードの最後の行を入力するか、コンソールに宇宙船の配列をログインしたときしかし、それは完璧に動作します。私はなぜこれが起こっているのか非常に混乱しており、何か助けに感謝します！前もって感謝します。

Answer 1

$.getJSONは、の非同期の機能です。つまり、starshipsがデータで満たされる前にalert()が呼び出されたため、未定義のプロパティエラーです。

非同期機能に依存するすべての操作は、コールバックに配置するか、コールバックから呼び出す必要があります。これを試してください：

$.getJSON('https://swapi.co/api/starships/', function(data) { 
    starshipData(data); 

    // 1: place the call in the callback 
    // 2: always use console.log to debug as it does not coerce data types 
    console.log(starships[0].starshipName); 
});