Promise深入学习

发表于 | 分类于 |
字数统计: 540 | 阅读时长 ≈ 2

一.回顾Promise

ES6引入的异步编程，语法上是一个构造函数，用来封装异步操作并可以获取成功或失败的结果
- Promise构造函数: Promise(excutor){}
- Promise.prototype.then 方法
- Promise.prototype.catch 方法
可以解决回调地狱的问题

  • allSettled与all区别
    allSettled无论数组中的promise成功还是失败都会执行完，all只要数组里面有reject就会停止,且返回失败的状态

更多代码见node/js/promise

1
2
3
4
5
6
7
8
9
10
11
12
13
14
//基本使用
const p = new Promise(function(resolve,reject){
            setTimeout(()=>{
                // let data = "读取成功"
                // resolve(data)
                let error = "失败"
                reject(error)
            },1000)
        })
            p.then(function(value){
                console.log(value)
            },function(err){
                console.error(err)
            })

从语法上说，Promise 是一个对象，从它可以获取异步操作的消息。

Promise 异步操作有三种状态：pending（进行中）、fulfilled（已成功）和 rejected（已失败）。除了异步操作的结果，任何其他操作都无法改变这个状态。

then 方法接收两个函数作为参数，第一个参数是 Promise 执行成功时的回调，第二个参数是 Promise 执行失败时的回调，两个函数只会有一个被调用
返回的结果是promise对象，对象的状态由回调函数的执行结果决定

  • 如果回调函数中返回的结果是 非promise 类型，状态为成功，返回值为对象的成功值
  • 支持链式调用—》（解决回调地狱）

async 和 await

都是异步编程的解决方案

async 函数中可能会有 await 表达式，async 函数执行时，如果遇到 await 就会先暂停执行 ，等到触发的异步操作完成后，恢复 async 函数的执行并返回解析值。

await 关键字仅在 async function 中有效 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

function testAwait(){
   return new Promise((resolve) => {
       setTimeout(function(){
          console.log("testAwait");
          resolve();
       }, 1000);
   });
}
 
async function helloAsync(){
   await testAwait();
   console.log("helloAsync");
 }
helloAsync();

//先等一秒  
//testAwait  
//helloAsync

await针对所跟不同表达式的处理方式：

  • Promise 对象：await 会暂停执行，等待 Promise 对象 resolve，然后恢复 async 函数的执行并返回解析值。
  • 非 Promise 对象：直接返回对应的值