我的函数正在返回 [对象承诺] [重复]答案

【问题标题】：my function is returning [Object promise] [duplicate]我的函数正在返回 [对象承诺] [重复]
【发布时间】：2020-07-05 03:28:35
【问题描述】：

我正在尝试获取星球大战角色及其家乡的列表。 homeworld 是一个链接，所以它需要另一个 fetch 来获取名称，但在控制台中它返回 [Object promise]。我认为问题在于尝试获得实际的行星名称需要太长时间。但是我该如何解决呢？

const processStarWars = function (jsonObject) {
    let arrStarWarsPeople = jsonObject.results;

    for (const personage of arrStarWarsPeople){
        const name = personage.name;
        const birthYear = personage.birth_year;

        const planet = fetch(personage.homeworld)
                .then(function (response) {
                //antwoord van functie fetch bekijken
                if (!response.ok){
                    throw error(`Er lijkt een fout te gebeuren, status code ${response.status}`);
                }else{
                    console.log("object goed gevonden");
                    return response.json();
                }
            }).then(function(jsonObject){
                //alles is ok dus, we kunnen het object verwerken en doorgeven
                console.log(jsonObject.name);
                return jsonObject.name;
            }).catch(function (error) {
                //opvangen van een eventuele fout
                console.log(`Er was een fout bij het verwerken van de JSON, fout:${error}`);
            });
        
        console.log(`${name} - ${birthYear} - ${planet}`)
    }


};


const loadStarWarsInfo = function() {
    fetch("https://swapi.co/api/people/")
        .then(function (response) {
            
            if (!response.ok){
                throw error(`Er lijkt een fout te gebeuren, status code ${response.status}`);
            }else{
                console.log("object goed gevonden");
                return response.json();
            }
        }).then(function(jsonObject){
        
        console.log("alles oke we kunnen verder");
        processStarWars(jsonObject);
    }).catch(function (error) {
        
        console.log(`Er was een fout bij het verwerken van de JSON, fout:${error}`);
    })
};

document.addEventListener('DOMContentLoaded', function() {
    loadStarWarsInfo();
});

【问题讨论】：

这超出了承诺并立即运行 console.log(${name} - ${birthYear} - ${planet})
fetch 返回一个承诺。你无法改变这一点。请改用承诺。您已经在这里成功获得了名称：console.log(jsonObject.name)。使用它。
(1) 请让您的问题更清楚。标题说你的函数正在返回 [Object Promise]，但是有两个函数，都没有返回 [Object Promise]。 [Object Promise] 是函数打印的东西，而不是函数返回的东西。 (2) planet 是一个 Promise，而不是一个字符串。这就是为什么打印它会说 [Object Promise]。您需要等待 promise 解决，然后打印结果。
寻找关于 AJAX 或异步编程的文章，一旦你理解了这个概念，你就会更好地理解你在做什么。

标签： javascript api object promise fetch

【解决方案1】：

您可以通过像await fetch(personage.homeworld) 一样等待提取完成来解决此问题，并且需要使processStarWars 函数async。

演示：

const processStarWars = async function (jsonObject) {
    let arrStarWarsPeople = jsonObject.results;

    for (const personage of arrStarWarsPeople){
        const name = personage.name;
        const birthYear = personage.birth_year;

        const planet = await fetch(personage.homeworld)
                .then(function (response) {
                //antwoord van functie fetch bekijken
                if (!response.ok){
                    throw error(`Er lijkt een fout te gebeuren, status code ${response.status}`);
                }else{
                    console.log("object goed gevonden");
                    return response.json();
                }
            }).then(function(jsonObject){
                //alles is ok dus, we kunnen het object verwerken en doorgeven
                console.log(jsonObject.name);
                return jsonObject.name;
            }).catch(function (error) {
                //opvangen van een eventuele fout
                console.log(`Er was een fout bij het verwerken van de JSON, fout:${error}`);
            });
        
        console.log(`${name} - ${birthYear} - ${planet}`)
    }


};


const loadStarWarsInfo = function() {
    fetch("https://swapi.co/api/people/")
        .then(function (response) {
            
            if (!response.ok){
                throw error(`Er lijkt een fout te gebeuren, status code ${response.status}`);
            }else{
                console.log("object goed gevonden");
                return response.json();
            }
        }).then(function(jsonObject){
        
        console.log("alles oke we kunnen verder");
        processStarWars(jsonObject);
    }).catch(function (error) {
        
        console.log(`Er was een fout bij het verwerken van de JSON, fout:${error}`);
    })
};

document.addEventListener('DOMContentLoaded', function() {
    loadStarWarsInfo();
});

【讨论】：