我無法訪問陣列內的特定物件。我從一個api推送資料到陣列中。當我在控制臺記錄countryArr時，它顯示了完整的物件陣列及其所有屬性，但當我試圖訪問特定索引中的特定物件時，我得到了未定義。另外，它應該回傳一個陣列，但typeof顯示它是一個物件？誰能幫幫我？
const countriesURL = 'https://restcountries.eu/rest/v2/all'/span>;
let countriesArr = [];
async function getCountriesData（） {
const response = await fetch(countryURL);
const data = await response.json();
showCountries（資料）。
}
function showCountries(countries) {
countries.forEach((country) =>/span> {
countriesArr.push(country)
})}
console.log(countryArr) //this shows array of objects。
console.log(countryArr[0]) // this shows undefined????
uj5u.com熱心網友回復：
你的主要問題是資料的異步獲取，所以你向服務器發出請求，當它正在進行時，你的下一段代碼正在進行compeleting
。 getCountriesData() is loading...
showCountries(country)完成!
console.log(countryArr) complete!
console.log(countryArr[0]) complete!
在這種情況下，國家陣列是空的，當你采取[0]元素不存在時，JS回傳 "未定義"。
嘗試使用Promise API來避免這種情況：
。const countriesURL = 'https://restcountries.eu/rest/v2/all'/span>;
let countriesArr = [];
async function getCountriesData（） {
const response = await fetch(countryURL);
const data = await response.json();
showCountries（資料）。
}
function showCountries(countries) {
countries.forEach((country) =>/span> {
countriesArr.push(country)
})
}
/*此函式回傳特殊型別的Promise */。
getCountriesData().then(res => {
console.log(countryArr)
console.log(countryArr[0] )
})uj5u.com熱心網友回復：
像這樣嘗試：
const countriesURL = 'https://restcountries.eu/rest/v2/all'/span>;
let countriesArr = [];
async function getCountriesData（） {
const loading = document.createElement("P") 。
loading.innerText = 'Loading ...'。
document.body.appendChild（loading）。
await fetch(countryURL)
.then(response => response.json()
.then(data => countriesArr = data)
loading.remove()。
console.log(countryArr)
console.log(countryArr[0] )
}
getCountriesData()uj5u.com熱心網友回復：
const countriesURL = 'https://restcountries.eu/rest/v2/all'/span>;
let countriesArr = [];
async function getCountriesData（） {
const response = await fetch(countryURL);
const data = await response.json();
showCountries（資料）。
}
function showCountries(countries) {
countries.forEach((country) =>/span> {
countriesArr.push(country)
})}
getCountriesData（）。
console.log(countryArr) //this shows array of objects。
console.log(countryArr[0]) //this shows undefined ????
JavaScript是單執行緒的--無論它是在你的瀏覽器還是在NodeJS中運行。因此，當瀏覽器處理你的代碼時，它將處理top>down和評估起始檔案中的變數，并繼續將所有函式放入callstack中。
當瀏覽器引擎遇到一個異步函式時，它會獲取對該函式的參考，并將該函式放入回呼佇列中，如果它是一個承諾（async就是這樣，因為它只是一個承諾的包裝），它會被放入一個 "作業佇列"/"微任務佇列"。一旦異步函式發出一個完整的事件，瀏覽器引擎就會獲取這些資料，并將該函式及其參考推送到呼叫堆疊中，以便在堆疊中所有當前任務/函式完成后運行。該函式參考包含行號，因此引擎知道在哪里評估該函式。
因此，在了解到這一點后，當您到達 getCountriesData() 時，該異步函式將從主執行緒中跳出，并被放入一個單獨的佇列中，該佇列中包含專門用于網路相關任務的執行緒，并且程式執行將在 getCountriesData() 執行完畢前立即處理和評估以下控制臺日志。
你確定你正確地將從 getCountriesData() 收到的資料插入/操縱到 countriesArr 中的唯一方法是，你在該函式本身或在 then() 中進行的所有資料相關任務。
轉載請註明出處，本文鏈接：https://www.uj5u.com/qukuanlian/312758.html
標籤：
上一篇：篩選2DJS物件
下一篇：用try和catch塊處理錯誤