为何async/await仅在解构响应时才会等待另一个异步方法？

核心原因是运算符优先级，跟解构是否为语法糖无关，下面拆解两种写法的执行逻辑：

错误写法的执行逻辑 #

看这段代码：

const results = await methodRequest().response;

JavaScript中，.（属性访问）的优先级高于await，所以代码会按以下顺序执行：

1. 调用methodRequest()，返回一个Promise对象
2. 尝试访问这个Promise对象的.response属性——但Promise本身没有这个属性，所以得到undefined
3. 对undefined执行await：await会直接返回非Promise类型的值，所以最终results是undefined

等价于手动拆分的代码：

const promise = methodRequest();
const temp = promise.response; // 这里得到undefined
const results = await temp; // await undefined直接返回undefined

正确写法的执行逻辑 #

再看解构的写法：

const { response } = await methodRequest();

这里的执行顺序完全不同：

1. 先执行await methodRequest()：等待methodRequest()返回的Promise兑现，拿到它resolve的结果——也就是{ response: "resolved", error: "" }这个对象
2. 对这个已兑现的对象进行解构，取出response属性，自然能得到正确的"resolved"

等价于手动拆分的代码：

const resolvedObj = await methodRequest(); // 等待Promise完成，拿到返回对象
const response = resolvedObj.response;

总结 #

解构本身只是简化对象属性访问的语法糖，但两种写法的本质差异在于await的作用对象：

• 错误写法中，await作用的是undefined（Promise的.response属性）
• 正确写法中，await作用的是methodRequest()返回的Promise，等它完成后再处理返回的对象

内容的提问来源于stack exchange，提问作者user3648963