复习之promis

promise完美的解决了地狱回调

promise的介绍

// promise 承诺

// Promise是异步编程的一种解决方案，比传统的解决方案(回调函数和事件)更合理和更强大。它由社区最早提出和实现，ES6将其写进了语言标准，统一了用法，原生提供了Promise对象。

// 所谓Promise，简单说就是一个容器，里面保存着某个未来才会结束的事件（通常是一个异步操作）的结果。从语法上说，Promise是一个对象，从它可以获取异步操作的消息。

// Promise提供统一的API，各种异步操作都可以用同样的方法进行处理。

Promise对象有以下两个特点

// 1.对象的状态不受外界影响。Promise对象代表一个异步操作，有三种状态：pending(进行中)、fulfilled(已成功)和rejected(已失败)。只有异步操作的结果，可以决定当前是哪一种状态，任何其他操作都无法改变这个状态。这也是Promise这个名字的由来，它的英语意思就是“承诺”，表示其他手段无法改变。

// 2.一旦状态改变，就不会再变，任何时候都可以得到这个结果。Promise对象的状态改变，只有两种可能：从pending变为成功fulfilled和从pending变为失败的rejected。只要这两种情况发生，状态就凝固了，不会再变了，会一直保持这个结果，这时就称为resolved(已定型)。如果改变已经发生了，你再对Promise对象添加回调函数，也会立即得到这个结果。

// 这与事件(Event)完全不同，事件的特点是，如果你错过了它，再去监听，是得不到结果的。

// 许下承诺

// 承诺需要时间来见证 pending

// 承诺最后有了结果

// 兑现 resolve / fulfiled

// 违背 rejected

 

promise链式操作

 

. . . . 不停的点 链式操作

链式操作能够实现的根源在于 返回同类型的数据

 

promise的方法

 

// .then(成功的，失败的)

// .catch 捕获(失败)

// .finally 无论成功或者失败都会执行这个结果

 const p = new Promise((resolve, reject) => {
            setTimeout(() => {
                const num = parseInt(Math.random() * 100);
                if (num % 2) {
                    resolve(num)
                } else {
                    reject(num)
                }
            }, 300)
        })
        p
            .then(
                data => {
                    console.log(data + '成功');  // 奇数
                }
            )
            .catch(
                err => {
                    console.log(err + '失败');
                }
            )
            .finally(
                () => {
                    console.log('无论成功或者失败我都会执行');
                }
            )

 

Promise.all([p1,p2,p3]) 都会返回promise

// 结果 3个承诺如果都兑现 新的promise的结果就是成功的 数组 是要都实现才行没有实现就会返回这个这个失败的结果给这个promise的作为结果

// 其中一个结果没有兑现 新的promise的结果就是这个失败的结果

 

// all 异步的 里面的请求时同时发送的 1s

// 但是依然可以顺序拿到结果

 function aa(url) {
            return new Promise((resolve, reject) => {
                ajax({
                    type: 'get',
                    dataType: '',
                    url,
                    success: data => {
                        resolve(data)
                    }
                })
            })
        }

        let res = '';

// all 异步的 里面的请求时同时发送的 1s

// 但是依然可以顺序拿到结果

 res = Promise.all([aa('../php/1.php'), aa('../php/2.php'), aa('../php/3.php')]);
        console.log(res);
        res.then(
            data => {
                console.log(data);
            }
        )

 // 其中一个结果没有兑现 新的promise的结果就是这个失败的结果
 function aa(n) {
            return new Promise((resolve, reject) => {
                setTimeout(() => {
                    const num = parseInt(Math.random() * 100);
                    if (num % 2) {
                        resolve(`第${n}次成功的生成了奇数:${num}`)
                    } else {
                        reject(`第${n}次失败的生成了偶数:${num}`)
                    }
                }, 100)
            })
        }
  let res = Promise.all([aa(1), aa(2), aa(3)]);
        res
            .then(
                data => {
                    console.log(data);
                }
            )
            .catch(
                err => {
                    console.log(err);
                }
            )

Promise.race       

谁先取到数据 谁就作为新的promise的结果 不管是成功的还是失败的

  function aa(n) {
            return new Promise((resolve, reject) => {
                setTimeout(() => {
                    const num = parseInt(Math.random() * 100);
                    if (num % 2) {
                        resolve(`第${n}次成功的生成了奇数:${num}`)
                    } else {
                        reject(`第${n}次失败的生成了偶数:${num}`)
                    }
                }, 100)
            })
        }

        // race 比赛
        //   谁先取到数据  谁就作为新的promise的结果  不管是成功的还是失败的

        let res = Promise.race([aa(1), aa(2), aa(3)]);
        res
            .then(
                data => {
                    console.log(data);
                }
            )
            .catch(
                err => {
                    console.log(err);
                }
            )