这篇文章主要是关于Promise的all方法的介绍以及对Promise 的全面回顾

一、Promise的all方法

1.应用场景

  假设现在有一个需求，该需求依赖与两个网络请求，只有当两个网络请求成功后才能实现这个需求。我们可以通过all方法来实现，具体见下面的分析。

2.本质

  Promise中的all方法，是一个函数，并且传入的参数必须是可迭代对象，所谓的可迭代对象就是可以遍历的。

3.使用方式

针对上面的需求，用all方法实现的具体代码如下：

<script>
    Promise.all([
        new Promise((resolve,reject)=>{
            setTimeout(()=>{
                resolve('results1')
                },1000)
        }),
        new Promise((resolve,reject)=>{
            setTimeout(()=>{
                resolve('results2')
                },2000)
        })
    ]).then(results =>{
        console.log(results)
    })
</script>

针对上述的代码，从all、then两个函数入手，解析如下：
  首先，all 函数传入的参数定义为数组类型（数组是可迭代对象），将两个网络请求分别放在 promise 中。也可以简单的看成如下结构：Promise.all（[网络请求1，网络请求2]）
  然后就是then函数。then函数传入的参数也是数组类型，分别存放上述两个 resolve 的结果，所以最终在控制台上输出的结果如下：

image.png

二、Promise总结

1.概念

  Promise是异步编程的一种解决方案，通过将数据请求和数据处理分开来达到代码逻辑清晰的目的 o(￣▽￣)ｄ

2.本质

  Promise本质是一个类，所以可以通过new的方式来创建Promise。另外创建的Promise中，根据自己代码的需要传递两个参数 resolve 和 reject，这两个参数本身又是一个函数。最后是有关处理的两个函数** then 和 catch**

3.三种状态

三种状态分别是：Pending、Fulfilled、Reject。
  Pending--等待状态，浏览器向服务器发送请求到首届请求结果的过程就处于该状态；Fulfilled--满足状态，浏览器成功接收服务器发送的请求结果时，就处于该状态，并且会执行resolve函数；Reject--拒绝状态，浏览器不接受服务器发送的请求时，就处于该状态，并且会执行reject函数。

4.执行过程

下面结合一张图来分析Promise 的执行过程

5.链式处理

所谓链式处理可以简单的理解成是函数的迭代调用，有四种写法，分别如下：

            // 链式调用1
            new Promise((resolve,reject) =>{
                    setTimeout(()=>{
                        resolve()
                    },1000)
                }).then(()=>{
                    console.log('hello,vue')
                    return new Promise((resolve,reject) =>{
                            setTimeout(()=>{
                                resolve()
                            },1000)
                        })
                    }).then(() =>{
                        console.log('hello,java')
                        return new Promise((resolve,reject) =>{
                            setTimeout(()=>{
                                    resolve()
                                },1000)
                            })
                        }).then(() =>{
                            console.log('hello,JavaScript')
                        })
            
            // 链式调用2-1
            new Promise(resolve =>{
                setTimeout(()=>{
                    resolve('aaa')
                },1000)
            }).then(res =>{
                // 1.自己处理别的业务的代码
                console.log(res,'第一次自己处理别的业务的代码')
                
                // 2.对拿到的结果进行处理
                return new Promise(resolve =>{
                    resolve(res +'111')
                })
            }).then(res=>{
                console.log(res,'第二次自己处理别的业务的代码')
                
                return new Promise(resolve =>{
                    resolve(res +'222')
                })
            }).then(res =>{
                console.log(res,'第三次自己处理别的业务的代码')
            })
            
            // 链式调用2-2
            new Promise(resolve =>{
                setTimeout(()=>{
                    resolve('aaa')
                },1000)
            }).then(res =>{
                console.log(res,'第一次自己处理别的业务的代码')
                return  Promise.resolve(res +'111')
            }).then(res=>{
                console.log(res,'第二次自己处理别的业务的代码')
                return Promise.resolve(res +'222')
            }).then(res =>{
                console.log(res,'第三次自己处理别的业务的代码')   
            })
            
            // 链式调用2-3
            new Promise(resolve =>{
                setTimeout(()=>{
                    resolve('aaa')
                },1000)
            }).then(res =>{
                console.log(res,'第一次自己处理别的业务的代码')
                return  res +'111'
            }).then(res=>{
                console.log(res,'第二次自己处理别的业务的代码')
                return res +'222'
            }).then(res =>{
                console.log(res,'第三次自己处理别的业务的代码')   
            })

6.all方法

  all方法主要用来解决一个需求依赖与多个网络请求的情境，只有得到多个的网络请求的结果才能实现需求。

以上就是Promise知识点的总结，有不恰当的地方还请大家指出