通俗的解释什么是Promise

Promise是什么?

Promise英文翻译过来意为承诺,许诺。它的作用就像中文意思一样,是一种许诺。

MDN的解释:
Promise 对象是一个代理对象(代理一个值),被代理的值在Promise对象创建时可能是未知的。它允许你为异步操作的成功和失败分别绑定相应的处理方法(handlers)。 这让异步方法可以像同步方法那样返回值,但并不是立即返回最终执行结果,而是一个能代表未来出现的结果的promise对象。

说了这么多其实翻译成大白话就是:
1、媳妇儿饿了需要吃饭,所以我要上街买菜(异步方法
2、我什么时候买完菜回来她不知道(异步方法执行几秒未知),
3、但是买完菜回到家之后我会马上做个红烧排骨给媳妇吃(异步方法执行结束之后需要对返回值做处理
这时候怎么办呢,就用promise(承诺):
就说这个事情交给我吧,我承诺我去买菜,买完回来马上给你做红烧排骨,做完马上就叫你吃(这个地方相当于promise链式调用),你现在该干嘛干嘛去,去刷抖音,打游戏都可以(不影响其他代码的调用)。

一个 Promise有以下几种状态:
pending: 初始状态,既不是成功,也不是失败状态(我出门去买菜了,你等我回来)
fulfilled: 意味着操作成功完成。(买完菜回到家告诉媳妇儿我买到你要吃的菜了)
rejected: 意味着操作失败。(我没买到菜,你要不点个外卖吧)

pending 状态的 Promise 对象可能会变为fulfilled 状态并传递一个值给相应的状态处理方法,也可能变为失败状态(rejected)并传递失败信息。当其中任一种情况出现时,Promise 对象的 then 方法绑定的处理方法(handlers )就会被调用。
then方法包含两个参数:onfulfilled 和 onrejected,它们都是 Function 类型。当Promise状态为fulfilled时,调用 then 的 onfulfilled 方法,当Promise状态为rejected时,调用 then 的 onrejected 方法, 所以在异步操作的完成和绑定处理方法之间不存在竞争)。
在这里插入图片描述

看一段基础示例:

            new Promise((resolve, reject) => {
                console.log('code begin !');
                 let num = 4;
                // 假装执行一个异步方法
                setTimeout(() => {
                    console.log('async begin !');
                    num += 2;
                    // 把Promise状态设为fulfilled,并把结果传递出去
                    resolve(num);
                    // 把Promise状态设为rejected,并把失败信息传递出去
                    //reject('promise被手动中止');
                    // throw 'uncaught exception!'; // 这里要注意,catch无法捕获在异步方法里抛出的异常
                }, 1000);
            }).then((result) => { // 当Promise的状态被设为接受(fulfilled)时执行
                console.log('fulfilled :' + result);
            }, (reason) => { // 当Promise的状态被设为拒绝(rejected)时执行
                console.log('rejected :' + reason);
            }).catch((error) => { 
                console.log('error :' + error);
            }).finally(() => {
                // do something !
            });
                

then 方法返回一个 Promise。它最多需要有两个参数:Promise 的成功和失败情况的回调函数。

catch 方法当执行过程出现异常时执行,或Promise的状态被设为失败(rejected),并且没有设置rejected执行函数时也会执行。另外catch无法捕获在异步方法里抛出的异常

finally 方法由于无法知道promise的最终状态,所以finally的回调函数中不接收任何参数,它仅用于无论最终结果如何都要执行的情况。

另外Promise可以链式调用,如果then方法执行结束并返回一个新的Promise,那么将会按照顺序依次执行then方法。但是这里有一点要注意下:如果调用链中有一个出现异常或者状态被改为拒绝,那么调用链中剩下的就不会被执行。所以在使用链式调用时要慎重!

代码示例:

            new Promise((resolve, reject) => {
                console.log('code begin !');
                let num = 4;
                setTimeout(() => {
                    console.log('num + 2 = 6');
                    num += 2;
                    resolve(num);
                }, 1000);
            }).then((num) => {
                return new Promise((resolve, reject) => {
                    console.log('num * num = 36');
                    setTimeout(() => {
                        num *= num;
                        resolve(num);
                    }, 1000);
                });
            }).then((num) => {
                return new Promise((resolve, reject) => {
                    console.log('num + num = 72');
                    setTimeout(() => {
                        num += num;
                        resolve(num);
                    }, 1000);
                });
            }).then((result) => {
                console.log('fulfilled :' + result);
            }, (reason) => {
                console.log('rejected :' + reason);
            }).catch((error) => {
                console.log('error :' + error);
            }).finally(() => {
                // do something !
            });

在这里插入图片描述
Promise还有一些其他的方法例如 Promise.all(iterable):可以传递一个iterable(类似于数组)进去,它会等待iterable里的所有promise执行完毕后统一返回,返回的结果也是一个数组,将会按照参数内的 promise 顺序排列,而不是由调用 promise 的完成顺序决定.

	    Promise.all([mothod1(), mothod2()])
	         .then((result) => {
	             console.log('all complete');
	             console.log(result);
	         });
                
       function mothod1() {
            console.log('first mothod');
            return new Promise((resolve, reject) => {
                setTimeout(() => {
                    resolve('mothod1 complete');
                }, 2000);
            });
        }
        function mothod2() {
            console.log('second mothod');
            return new Promise((resolve, reject) => {
                setTimeout(() => {
                    resolve('mothod2 complete');
                }, 1000);
            });
        }

在这里插入图片描述

Promise.race(iterable):可以传递一个iterable(类似于数组)进去,一旦iterable中的某个promise解决或拒绝, promise就会解决或拒绝。

			Promise.race([mothod1(), mothod2()])
                .then((result) => {
                    console.log(result);
                    console.log('complete');
                });

在这里插入图片描述

猜你喜欢

转载自blog.csdn.net/qq_41885871/article/details/103735447