Promise对象及相关实例方法介绍

Promise是一种处理异步操作的方法,提供了更好的解决方案。本文详细介绍了Promise的含义、基本用法、then、catch、finally方法,以及Promise.all、Promise.race、Promise.resolve、Promise.reject等实例方法。通过这些方法,可以更好地管理和控制异步操作,使其看起来像同步执行。
摘要由CSDN通过智能技术生成

Promise 对象

1.0 Promise 的含义

Promise 是一步编程的一种解决方案, 比传统的解决方案 — 回调函数和事件 — 更合理和更加强大.

所谓 Promise, 简单来说就是一个容器, 里面保存着某个未来才会结束的事件(通常是一个一步操作)的结果.

Promise 对象有以下两个特点.

  1. 对象的状态不受外界影响. Promise 对象代表一个一步操作, 有三种状态: pending , fulfilledrejected . 只有异步操作的结果, 可以决定当前是哪一种状态, 其他任何操作都无法改变这个状态.
  2. 一旦状态改变, 就不会再变, 任何时候都可以得到这个结果. Promise 对象的状态改变, 只有两种可能: 从 pending 变为 fulfilled 和从 pending变为rejected. 这要这两种情况发生, 状态就凝固了, 不会再改变了, 会一直保持这个结果, 这时就称为 resolved(已定性). 如果改变已经发生了, 你再对 promise 对象添加回调函数, 也会立即得到这个结果. 这与事件完全不同, 事件的特点就是, 如果你错过了它, 你再去监听,是得不到结果的.

有了 Promise 对象, 就可以将异步的操作 以 同步的流程表达出来., 避免了层层嵌套函数. 此外, Promise 对象提供统一的接口,使得控制异步操作更加容易.

Promise 也有一些缺点,:

  • 首先, 无法取消 Promise, 一旦新建它就会立即执行, 无法取消.
  • 其次, 如果不设置回调函数, Promise 内部抛出的错误, 不会反映到外部.
  • 第三, 当处于 pending 状态时, 无法得知目前进展到哪一个阶段(即: 无法得知是刚刚开始还是即将完成).

2.0 基本用法

ES6 规定, promise 对象是一个构造函数, 用来生成 Promise 实例.

下面代码创造了一个 Promise 实例

const promise = new Promise(function(resolve, reject) {
    
  // ... some code

  if (/* 异步操作成功 */){
    
    resolve(value);
  } else {
    
    reject(error);
  }
});

Promise 构造函数接收一个函数作为参数, 该函数的两个参数分别是 resolvereject. 它们是两个函数, 有JavaScript 引擎提供, 不用自己部署.

resolve 函数的作用是, 将 Promise 对象的状态从"未完成" 变为 “成功”(即从 pending 变为 resolved), 在异步操作成功时调用, 并将异步操作的结果, 作为参数传递出去.

reject 函数的作用是, 将 Promise 对象的状态从 “未完成” 变为 “失败” (即从 pending 变为 rejected), 在异步操作失败时调用, 并将异步操作爆出的错误, 作为参数传递出去.

Promise 实例生成以后, 可以用 then 方法分别指定 resolved 状态和 rejected 状态的回调函数.

promise.then((value)=>{
    
    // success
},(error)=>{
    
    // failure
})

then 方法可以接收两个回调函数作为参数,:

  • 第一个回调函数是 Promise 对象的状态变为 resolved 时调用
  • 第二个回调函数是 Promise 对象的状态变为 rejected 时调用.

其中, 第二个函数是可选的, 不一定要提供. 这两个函数都接受 Promise 对象传出的值作为参数.

下面是一个 Promise 对象的简单例子.

function timeout(ms) {
    
  return new Promise((resolve, reject) => {
    
    setTimeout(resolve, ms, 'done'); // 把 'done' 结果传给 resolve 函数.
  });
}

timeout(100).then((value) => {
    
  console.log(value); // done
});

🏴 注意: setTimeout函数理解

var timeoutID = scope.setTimeout(function[, delay, arg1, 
  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值