我认为我没有正确理解诺言。我了解的是fetch()
返回了一个Promise,我尝试使用.then()
返回Promise中的值,但是我总是无法定义。另外令我困惑的是,我可以console.log()
并显示数据,但是当我尝试在其他地方使用它时,它返回undefined
。我在这里做什么错了?
var getData = function(){
var getRaceData = function()
{
fetch('http://ergast.com/api/f1/2008.json')
.then(function(response) {
response.json().then(function(data) {
var raceSeason = data.MRData.RaceTable;
var raceData = raceSeason.Races;
console.log(raceData);
// Not returning racedata here, always get undefined
return raceData;
});
}
)
.catch(function(err) {
return;
});
}
}
答案 0 :(得分:2)
您需要返回调用response.json().then(...)
的结果。通常,您可以通过链接第一个then
的结果而不是嵌套来实现此目的(嵌套有其用途,但可能不在这里)。您还需要返回整个链(假设数据应该离开getRaceData
):
var getData = function(){
var getRaceData = function()
{
return fetch('http://ergast.com/api/f1/2008.json')
.then(function(response) {
return response.json();
}).then(function(data) {
var raceSeason = data.MRData.RaceTable;
var raceData = raceSeason.Races;
console.log(raceData);
return raceData;
})
.catch(function(err) {
return;
});
}
}
不过,还有一些其他注意事项:
您不检查HTTP错误。这是fetch
API中的步枪,它仅在 network 错误而不是HTTP错误时拒绝。相反,您必须添加一张支票。
理想情况下,您应该报告或以其他方式处理拒绝,而不是让其默默失败。 :-)
getData
中的代码仅创建一个函数,而没有调用它。但是我假设您正在使用未显示的代码来调用它。
所以:
var getData = function(){
var getRaceData = function()
{
fetch('http://ergast.com/api/f1/2008.json')
.then(function(response) {
if (!response.ok) {
throw new Error("HTTP error " + response.status);
}
return response.json();
}).then(function(data) {
var raceSeason = data.MRData.RaceTable;
var raceData = raceSeason.Races;
console.log(raceData);
return raceData;
})
.catch(function(err) {
// ...report/handle the error...
});
};
// Presumbly use `getRaceData` here; the code above only *defines* it.
};