为何同步打印Promise时显示pending但状态为fulfilled？

先看你给出的示例代码：

const url = "https://jsonplaceholder.typicode.com/users";
const promise = fetch(url);
console.log(promise);

执行后控制台显示的Promise {<pending>}和[[PromiseState]]: "fulfilled"并不是同时存在的状态，背后是两个时间点的状态快照：

• 为什么同步的console.log能看到fulfilled状态？
  浏览器控制台的对象展示是惰性求值的：当你执行console.log(promise)时，Promise确实处于pending状态，所以控制台先输出了这个状态的字符串描述。但当你点击展开这个Promise对象查看内部属性时，已经是之后的时间了——此时网络请求已经完成，Promise状态已经变为fulfilled，控制台会实时读取它的当前状态并展示出来。

• 为什么会同时呈现两种状态？
  这是控制台的显示机制导致的误解：外层的Promise {<pending>}是执行console.log那一刻的状态快照，而内部的[[PromiseState]]是你展开对象时的实时状态。Promise的状态是不可逆的，同一时刻只会处于pending/fulfilled/rejected中的一种，不会同时存在两种状态。

如果想要真正捕获console.log执行时的Promise状态，可以把它转为快照对象，比如：

const url = "https://jsonplaceholder.typicode.com/users";
const promise = fetch(url);
// 序列化后再打印，获取执行时的状态快照
console.log(JSON.parse(JSON.stringify(promise)));

这时候打印出来的就只会是pending状态，因为序列化是在同步执行时完成的，后续状态变化不会影响这个快照。

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