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

我正在调用一个url并尝试以JSON的形式获取数据，这基本上是从StackOverflow上的其他答案复制的。但是，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
（稍后在方法中返回）将
[对象承诺]
分配给
响应
，我假设它是承诺的
toString（）

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

编辑：“第二次呼叫”指的是我第二次访问。如果您现在查看代码，我的意思是，当我返回响应时，我会假设该响应将被分配
responseData.title
，它将被分配
[对象承诺]

Edit2：我也意识到，“（null）”永远不会被传递，不管发生什么。这只是我多次尝试让它成功的一个过程中的一个遗留问题

Edit3：我添加了整个方法主体
我认为这应该有效：

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

您必须在第一次
then（）
调用中返回您的响应

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

你所做的应该是有效的，所以可能是你如何“称之为第二次”造成了问题。请解释你实际上在做什么

同时，这可能会有所帮助

试着这样做

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)

或者作为一种功能（为什么不？）

编辑：
看看你的代码，我猜你只是简单地调用了你的
getTitleForId
函数，没有任何等待或承诺处理。异步函数将始终返回承诺；在这里，调用该函数时得到的是类型为Promise（string）的对象

您使用的是wait，因此实际上没有必要为混乱的then语法而烦恼

您的代码可以这样重写：

const resp = await fetch(url);
const responseData = resp.json();
console.log(responseData.title);
const response = responseData.title;
console.log(response); // prints the title

在第一种情况下，
return
是隐式的：
。然后（resp=>resp.json（））
与
相同。然后（resp=>{return resp.json（）}）
刚刚尝试了这个，我得到了与之前相同的响应。我得到了与以前相同的响应。您能否澄清您在何时何地记录
响应
？我没有记录响应，我稍后会访问它。请参阅上面的编辑。这种情况很可能是因为您正在使用
wait
和
.then（）
链接在一起。你能把代码重构成类似于
async doSomething（）{const response=await-fetch（url）；const-responseData=await-response.json（）；console.log（responseData.title）；}
@Ricky我刚才试过了。同样的问题你能试着做一个完整的例子吗？示例中的所有行都在同一个异步函数中吗？@loganfsmyth我刚刚添加了method@realmature您能否将异步函数体包装在一个try-catch中，看看它是否抛出任何错误？比如，你需要解释什么？我在那里显示了确切的代码。我访问
responseData.title
的两次结果是两个不同的值。当我稍后在块中的原始代码中访问
响应
时，其值为
[object Promise]
。我很乐意详细说明，但我不知道您需要详细说明什么。例如，您的变量响应声明在哪里，如何第二次访问它，基本上您的整个代码都可以帮助理解。我只是注意到您的编辑。你是对的，我只是在调用那个方法。现在我要深入研究这个链接对于事后来到这里的任何人来说，重要的是要注意，您希望处理异步函数的任何函数也必须是异步的（直到您返回的变量被使用）。这可能意味着调用任何调用异步函数的函数的每个父函数都需要是异步的，当然所有异步函数都需要有“await”关键字这基本上是以相同的问题结束的，除了其中一个响应未定义而不是标题的值之外，我认为问题不在于接收数据的客户端代码，而在于发送数据的服务器代码。那么，我以前如何记录正确的响应呢？我认为更可能的是我没有正确处理异步，因为在方法执行时，它知道应该使用什么值be@PatrickHund
.json（）
返回一个承诺，也应该等待它
const responseData=await resp.json（）
const resp = await fetch(url);
const responseData = resp.json();
console.log(responseData.title);
const response = responseData.title;
console.log(response); // prints the title