Promise 使用 es6的一些新增Promise 方法

128 阅读2分钟

Promise 使用 es6的一些新增Promise 方法

promise 是异步编程的解决方案 通过new 创建promise实例

构造函数的参数是一个回调函数,该回调函数有两个参数分别是resolve reject 异步请求成功执行resolve 异步请求失败执行reject

一个小案例

1秒后执行返回1,3秒后返回3,5秒后返回5 并且显示总耗时长 为9000毫秒左右=9秒

function fn() {
    // 这个方法适合异步 就是请求接口时候使用
    new Promise((resolve, reject) => {
        // 异步请求成功执行resolve 
        // 异步请求失败执行reject
        // 开启计时 谷歌内置插件
        console.time('总共耗时')
        setTimeout(() => {
            // 返回数据为1
            resolve(1)
        }, 1000)
    }).then((res) => {
        // 获取上一个Promise返回给的信息为1
        console.log(res);
        // 再次创建Promise 创建定时器返回信息
        new Promise(resolve => {
            setTimeout(() => {
                resolve(3)
            }, 3000)
        }).then((res1) => {
            // 范湖信息在then中的log获取
            console.log(res1);
            // 然后再次创建Promise
            new Promise(resolve => {
                setTimeout(() => {
                    resolve(5)
                }, 5000)
            }).then(res2 => {
                // 获取返回信息
                console.log(res2);
                // 返回计时毫秒数 必须带名称与计时器名一致
                console.timeEnd('总共耗时')
            })
        })
    })
}
fn()

Promise

Promise 是一个构造函数,通过new创建promise实例,
构造函数是回调函数并且有两个参数为,resolve reject
异步请求执行成功resolve 异步请求执行失败reject
并且还有三种状态:
   pending(进行中)、fulfilled(已成功)和rejected(已失败)
   状态一旦改变不能在更改
 // 三个异步都都变成fullfilled   Promise.all([异步1,异步2,异步3])变成fullfilled
      Promise.all([异步1, 异步2, 异步3]).then((res) => {
        // res==[异步1结果,异步2结果,异步3结果]
      })

      // 三个异步只要有一个变成fullfilled   Promise.all([异步1,异步2,异步3])变成fullfilled
      Promise.race([异步1, 异步2, 异步3]).then((res) => {
        // res==[异步1结果,异步2结果,异步3结果]
      })