这一次,彻底搞懂Promise的状态转换

简介: 这一次,彻底搞懂Promise的状态转换

这篇文章解决了我很久的困惑,也希望能够解决看到的小伙伴的困惑,谢谢。

Promise的三种状态到底是什么?

  1. pending
  2. fulfilled
  3. rejected

下面我们先看下三种状态的产生

1.pending状态的Promise

const promise1 = new Promise((resolve,reject) => {
})
console.log(promise1);

image.png

2. fulfilled状态的Promise

const promise1 = new Promise((resolve, reject) => {
    setTimeout(() => {
        resolve()
    })
})
console.log(promise1);


image.png

3. rejected状态的Promise

const promise = new Promise((resolve, reject) => {
        setTimeout(() => {
            reject();
        })
    });
    console.log(promise);


从pending状态到fulfilled状态的变化过程

  • resolve()后状态从pending变为了fulfilled
const promise = new Promise((resolve, reject) => {
        setTimeout(() => {
            console.log('resolve前Promise的状态:',promise);
            resolve();
            console.log('resolve后Promise的状态:',promise);
        })
    });


image.png

从pending状态到rejected状态的变化过程

  • reject()后状态从pending变为了rejected
const promise = new Promise((resolve, reject) => {
        setTimeout(() => {
            console.log("Promise的状态:reject前:",promise);
            reject();
            console.log("Promise的状态:reject后:",promise);
        })
    });


image.png

下面介绍下关于Promise状态的可能的疑问

疑问1:resolved状态和fulfilled状态是一回事吗?

答:并不是一回事,resoved状态指的是完成了,不会再改变的状态,只是一种叫法,并不是真正的状态,真正的状态还是前文提到的那三种,pending、fulfilled、rejected这三种,所以resolved状态可能是fulfilled也可能是rejected。

疑问2:Chrome浏览器显示的状态时pending,点开却是fulfilled,到底哪

image.png

参考文献

Promise中的resolved和fulfilled到底什么关系,又或者这只是叫法的问题?

Promise的状态和现象【JS面试题】

相关文章
|
安全 Shell Android开发
Android系统 init.rc开机执行shell脚本
Android系统 init.rc开机执行shell脚本
3768 0
|
存储 Java 文件存储
ZooKeeper 避坑实践: SnapCount设置不合理导致磁盘爆满,服务不可用
本篇通过深入解读ZooKeeper 数据文件生成机制,以及ZooKeeper 中和数据文件生成相关的参数,探究一下 解决 ZooKeeper 磁盘问题的最佳实践。
ZooKeeper 避坑实践: SnapCount设置不合理导致磁盘爆满,服务不可用
|
前端开发 JavaScript 开发者
【前端革新力】React与CSS-in-JS完美邂逅:从styled-components到emotion,全面解析样式管理新趋势的实战应用与优势剖析!
【8月更文挑战第31天】CSS-in-JS 作为一种新兴的样式管理方式,近年来在前端社区受到广泛关注。它将样式嵌入 JavaScript,实现了样式与逻辑的高度耦合,提升了开发效率并解决了全局样式污染等问题。本文通过具体代码示例,探讨 CSS-in-JS 在 React 开发中的应用,并分享实践心得。首先介绍了 CSS-in-JS 的基本概念,然后详细展示了如何使用 styled-components 和 emotion 这两个流行库创建样式化组件。
725 0
|
人工智能 TensorFlow 算法框架/工具
AI计算机视觉笔记十七:实例分割
本文介绍了计算机视觉中的实例分割技术,通过结合目标检测和语义分割的方法,实现对图像中不同实例的精确区分与标记。以识别多只猫为例,详细描述了使用Mask R-CNN模型进行实例分割的过程,并提供了相关代码及环境搭建指南。通过实例演示,展示了如何利用该技术成功识别并分割出图像中的各个对象。
|
jenkins 网络安全 持续交付
Jenkins Pipeline 流水线 - 上传文件 Publish over SSH + Docker 编译 + 上传到阿里仓库
Jenkins Pipeline 流水线 - 上传文件 Publish over SSH + Docker 编译 + 上传到阿里仓库
436 0
|
人工智能 数据库 数据安全/隐私保护
30w粉丝后我发现,普通人想靠自媒体逆袭,已经没有机会了
作者分享了其对当前自媒体行业困境的观察,指出2023年以来,普通人做自媒体变得越来越困难。原因包括:一是经济环境下行,公司减少,可推广内容变少,而做自媒体的人增多,竞争激烈;二是监管加强,内容质量和变现方式需更规范,增加了入门门槛;三是AI技术如GPT的发展,使得内容创作更加普及,差异化减少,进一步压缩了普通人的机会。作者认为,现在要成功做自媒体,可能需要具备独特的天赋,而这是无法通过努力获得的。
439 0
|
SQL Java 数据库连接
【Java】已解决java.sql.SQLTimeoutException异常
【Java】已解决java.sql.SQLTimeoutException异常
562 0
|
设计模式 存储 前端开发
【设计模式】MVC与MVVM详尽解读与实战指南
【设计模式】MVC与MVVM详尽解读与实战指南
2361 0
|
前端开发 JavaScript
js【详解】Promise(含 Promise 的三种状态及其变化,创建 Promise, Promise.all 语法、Promise.all 实战范例、手写 Promise.all)
js【详解】Promise(含 Promise 的三种状态及其变化,创建 Promise, Promise.all 语法、Promise.all 实战范例、手写 Promise.all)
2956 0