javascript - 从 JavaScript Promise 对象正确获取 JSON 字段的值

Question

我正在调用一个 url 并尝试获取 JSON 格式的数据，我基本上是从 StackOverflow 上的其他答案中复制的。但是，在我在下面的第二个 .then() 调用中进行的两次调用中，responseData.title 有两个不同的值:

var getTitleForId = async function(id) {
    if (!id)
        return false

    let url = id + "other stuff to make a valid api call"

    let response = '(null)'

    await fetch(url)
        .then((resp) => resp.json())
        .then((responseData) => {
            console.log(responseData.title);
            response = responseData.title;
    })

    return response
}

在第一次调用 console.log(responseData.title) 中，日志显示 json 响应的标题字段。

在第二次调用中，response = responseData.title(稍后在方法中返回)将 [object Promise] 分配给 response我认为这是 Promise 的 toString()

我什至不会假装 JavaScript 是我的强项，所以如果我遗漏了一些微不足道的东西，请提前道歉。

编辑:“第二次调用”是指我第二次访问。如果您现在查看代码，我的意思是，当我返回响应时，我假设它会被分配 responseData.title，但它被分配了 [object Promise]

Edit2:我还意识到，无论发生什么，“(null)”都不会被传递。这只是我多次尝试完成这项工作时留下的遗留物。

Edit3:我添加了方法的整个主体

Answer 1

您所做的应该有效，因此可能是您“第二次调用它”的方式导致了问题。请解释您实际在做什么。

与此同时，这可能会有所帮助

尝试这样做

var title = await fetch(url)
    .then(resp => resp.json())
    .then(responseData => responseData.title);

console.log(title);

或者这个

var titlePromise = fetch(url)
    .then(resp => resp.json())
    .then(responseData => responseData.title);

titlePromise.then(console.log)

或者作为一个函数(为什么不呢？)

var getTitle = url => fetch(url)
    .then(resp => resp.json())
    .then(responseData => responseData.title);

getTitle(url).then(console.log)

编辑:看看你的代码，我猜你只是简单地调用你的 getTitleForId 函数，没有任何等待或 promise 处理。 async 函数总是会返回一个 promise；这里调用该函数时得到的是 Promise(string) 类型的对象。

https://www.twilio.com/blog/2015/10/asyncawait-the-hero-javascript-deserved.html