理解 Promise

最新推荐文章于 2025-02-20 22:16:32 发布

原创最新推荐文章于 2025-02-20 22:16:32 发布 · 233 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #js

文章目录

前言
基本概念
基本用法

前言

Promise 是异步编程的一种解决方案，比传统的解决方案——callback回调函数和事件——更合理且更强大。它最早由社区提出并实现，ES6将其写进了语言标准，统一了用法，并原生提供了Promise对象。Promise说得通俗一点就是一种写代码的方式，并且是用来写JavaScript编程中的异步代码的

基本概念

名称

译为“承诺”，这也就表达了将来会执行的操作，代表异步操作；

状态

pending状态（进行中）
fulfilled状态（已成功）
rejected状态（已失败）

特点

一旦状态改变就不会再变（两种状态改变：成功或失败）
pending -> fulfilled
ending -> rejected
只有异步操作可以决定当前处于的状态，并且任何其他操作无法改变这个状态；

基本用法

创建Promise：Promise 对象是由关键字 new 及其构造函数来创建的。

代码如下（示例）：

var promise = new Promise(function(resolve, reject){
    if (...) {
        resolve(value);
    } else {
        reject(error);
    }
})

Promise构造函数接受一个函数作为参数，该函数的两个参数分别是resolve和reject。它们是两个函数，由JavaScript引擎提供，不用自己部署。

resolve作用是将Promise对象状态由“未完成”变为“成功”，也就是pending -> fulfilled，在异步操作成功时调用，并将异步操作的结果作为参数传递出去；而reject函数则是将Promise对象状态由“未完成”变为“失败”，也就是pending -> rejected，在异步操作失败时调用，并将异步操作的结果作为参数传递出去。

then
我们通过then方法，分别指定resolved状态和rejected状态的回调函数。

参数一： Promise对象状态改为Resolved时调用（必选）
参数二： Promise对象状态改为Rejected时调用（可选）

  promise.then(function(value) {
      // success
  }, function(error) {
      // failure
  });

执行顺序

let promise = new Promise(function(resolve, reject){
    console.log("1");
    resolve()
});
promise.then(() => console.log("2"));
console.log("3")

// 1
// 3
// 2

执行后，我们发现输出顺序总是 1 > 3 > 2。表明，在Promise新建后会立即执行，所以首先输出 1。然后，then方法指定的回调函数将在当前脚本所有同步任务执行完后才会执行，所以2 最后输出。

与定时器混用

let promise = new Promise(function(resolve, reject){
    console.log("1");
    resolve();
});
setTimeout(function(){
	console.log("2");	
}, 0);
promise.then(() => console.log("3"));
console.log("4");

// 1
// 4
// 3
// 2