Promise是什么？怎么使用？回调地狱

Posted 2023-03-11 成全我的理想

Promise概念：

Promise是ES6提供的原生的类（构造函数）， 用来传递异步操作的消息。它代表了某个未来才会知道结果的事件（通常是一个异步操作）。

Promise的两个特点：

　　（1）对象的状态不受外界影响。

　　　　Promise 有三种状态：Pending（进行中）、Resolved（已完成，又称 Fulfilled）和 Rejected（已失败）。

　　（2）一旦状态改变，就不会再变

　　　　状态改变，只有两种可能：从 Pending 变为 Resolved 和从 Pending 变为 Rejected

　　（3）Promise的作用

　　　　解决回调地狱的问题。

function fn1(cb)
    console.log("fn1开始");
    setTimeout(function()
        console.log("fn1的异步操作");
        cb();
    ,1000);
    console.log("fn1结束");    


function fn2(cb)
    console.log("fn2开始");
    setTimeout(function()
        console.log("fn2的异步操作");
        cb();
    ,1000);
    console.log("fn2结束");    

function fn3(cb)
    console.log("fn3开始");
    setTimeout(function()
        console.log("fn3的异步操作");
        cb();
    ,1000);
    console.log("fn3结束");    

​
function fn4()
    console.log("fn4开始");
    console.log("fn4结束");    

​
// 把fn1 里的代码全部(包括异步操作)执行完毕后，执行fn2，fn2的异步操作执行完毕，再执行fn3；
fn1(function()
    fn2(function()
        fn3(fn4);
    )
);

Promise 对象可以将异步操作以同步操作的流程表达出来（使用链式的写法），避免了层层嵌套的回调函数。

如：函数fn1和fn2，当我们需要在fn1(fn1函数里有异步操作)调用结束后调用fn2，一般的解决方案是fn1（fn2）。而promise的做法是 fn1().then(fn2);即Promise将回调模式的主从关系调换了一个位置，变成了同等的只是顺序的关系

fn1().then(fn2).then(fn3).then(fn4)

Promise类的方法

console.dir(Promise)查看一下。

1、promise构造函数的参数是个函数 2、该函数（Promise的参数）的参数有两个：resolve，reject resolve 表示异步操作成功时，要调用的函数。是then函数的第一个参数 reject 表示异步操作失败时，要调用的函数。是then函数的第二个参数

new Promise(function(resolve, reject)
    // 异步操作的代码// 如果异步操作成功，调用resolve；如果失败，调用reject；
);

对象方法：then、catch

then方法：

功能：把then方法的参数传给resolve和reject。 promise对象.then(resolve回调函数,reject回调函数);

参数：

• then方法的第一个参数是resolve
• then方法的第二个参数是reject。

返回值：promise对象本身，所以，then调用完毕后，还可以继续调用then（即：链式调用）

Promise中then方法的数据传递

上一个then的返回值（结果）是下一个then的参数（输入）

类方法： all , race

all方法：

功能： Promise.all可以并行执行多个异步操作，并且在一个回调中处理所有的返回数据。返回的数据与传的参数数组的顺序是一样的。当所有的异步操作都成功才表示成功 。

参数：数组。数组里是若干个返回promise对象的函数（异步操作）；

返回值：promise对象。promise对象的then方法的回调函数的参数是 所有promise对象的resolve的参数（数组形式）。
all：用Promise.all来执行，all接收一个数组参数，两个异步操作是并行执行的，等到它们都执行完后才会进到then里面。而两个异步操作返回的数据都在then里面，all会把所有异步操作的结果放进一个数组中传给then，就是上面的results

race方法：

功能：也是并发，但是，与all不同之处时，当一个异步操作完成（resolve或reject）时，就调用方法了。即：多个异步操作，同时执行，谁快就用谁的结果，所以，结果不再是数组。

 

总结Promise的使用步骤：

1、找到（曾经的）异步操作的代码，放在Prmoise构造函数的参数（函数）里 2、参数（函数）的第一个参数resolve是成功时调用的函数，对应then方法（函数）的第一个参数 3、参数（函数）的第二个参数reject是失败时调用的函数，对应then方法（函数）的第二个参数