Promise常用api

一catch的用法

与Promise对象方法then方法并行的一个方法就是catch,与try catch类似，catch就是用来捕获异常的，也就是和then方法中接受的第二参数rejected的回调是一样的

function pro() { let p = new Promise((resolve, reject) => { setTimeout(() => { var num = Math.ceil(Math.random() * 20); console.log('随机数生成的值：', num) if (num <= 10) { resolve(num); } else { reject('数字太于10了即将执行失败回调'); } }, 2000); }) return p } pro().then( (data) => { console.log('resolved成功回调'); console.log('成功回调接受的值：', data); }, ).catch( (reason, err) => { console.log('catch到rejected失败回调'); console.log('catch失败执行回调抛出失败原因：',reason) } ); pro().then( (data) => { console.log('resolved成功回调'); console.log('成功回调接受的值：', data); } ).catch( (reason, err) => { console.log('catch到rejected失败回调'); console.log('catch失败执行回调抛出失败原因：',reason) } );

效果和写在then的第二个参数里面一样。它将大于10的情况下的失败回调的原因输出，但是，它还有另外一个作用：在执行resolve的回调时，如果抛出异常了，那么并不会报错卡死js，而是会进到这个catch方法中。

function pro() { let p = new Promise((resolve, reject) => { setTimeout(() => { var num = Math.ceil(Math.random() * 20); console.log('随机数生成的值：', num) if (num <= 10) { resolve(num); } else { reject('数字太于10了即将执行失败回调'); } }, 2000); }) return p } pro().then( (data) => { console.log('resolved成功回调'); console.log('成功回调接受的值：', data); console.log(abc); }, ).catch( (reason, err) => { console.log('catch到rejected失败回调'); console.log('catch失败执行回调抛出失败原因：', reason) } );

在resolve的回调中，我们console.log(abc);而abc这个变量是没有被定义的。如果我们不用Promise，代码运行到这里就直接在控制台报错了，不往下运行了。但是在这里，会得到上图的结果，也就是说进到catch方法里面去了，而且把错误原因传到了reason参数中。即便是有错误的代码也不会报错了

二all用法

all(arr) 这个的方法会返回一个新的promise，如果里面所有的promise对象都成功才会触发，一旦有一个失败 则该promise对象失败

const proms = []; for (let i = 0; i < 10; i++) { proms.push(new Promise((resolve, reject) => { setTimeout(() => { if (Math.random() < 0.9) { console.log(i, "完成") resolve(i) } else { console.log(i, "失败") reject(i) } }, 1000) })) } const pro = Promise.all(proms); pro.then(data => { console.log("全部完成", data) }) pro.catch(err => { console.log("又失败的情况", err) })

这样以后就可以用all并行执行多个异步操作，并且在一个回调中处理所有的返回数据，比如你需要提前准备好所有数据才渲染页面的时候就可以使用all,执行多个异步操作将所有的数据处理好，再去渲染

三race的用法

race(arr) 当数组中任意一个promise对象完成时，就马上会去使用完成了的promise对象的结果，不管这个结果是成功还是失败

const proms = []; for(let i = 0;i<10;i++){ proms.push(new Promise((resolve,reject)=>{ setTimeout(()=>{ if(Math.random() < 0.5){ console.log(i,"完成") resolve(i) }else{ console.log(i,"失败") reject(i) } },Random(1000,3000)) })) } const pro = Promise.race(proms); pro.then(data=>{ console.log("有一个先完成了",data) }) pro.catch(err=>{ console.log("有一个先失败的情况",err) }) function Random(min,max){ return Math.floor(Math.random() * (max-min) + min) }