[ JS个人笔记 ] Promise —DAY9

Promise 是用来优化非同步的语法。

Promise 物件状态pending: 初始状态fulfilled: 操作成功rejected: 操作失败Promise 事件成功或失败所对应的方法resolve(): 传送成功的讯息reject(): 传送失败的讯息状态连接处理then(): 接收 resolve 的讯息catch(): 接收 reject 的讯息其他方法Promise.race():传入多个 promise 事件，仅会回传第一个完成的事件(不论成功与否，只要完成即回传)任何一事件完成就会进入下一阶段，第一个事件完成后其他事件依旧执行，并不停摆Promise.all():传入多个 promise 事件，在全部完成后才进行下一步只要有任一 promise 事件 reject，立即回传 rejected 状态 promise 物件若事件都成功，会回传阵列

程式基本架构

let factor = true   //非同步事件的成功与否let condition = function(something) {   return new Promise(function (resolve, reject) {     if(something) {         resolve("成功了");     } else {         reject('失败QQ');     }   });}//-----------------------可简写成以下------------------------/*let condition = function(something) {     if(something) {        return  Promise.resolve("成功了");     } else {        return Promise.reject('失败QQ');     }   }*///----------------------------------------------------------condition(factor).then(function(val) {   console.log(val);}).catch(function(err) {   console.log(err);});

Promise Chain

当要依序处理非同步事件时，使用 .then 串接，并在最尾端接上 .catch若其中一次失败，.catch只会接到第一个失败的讯息，而后不继续执行。若是要跳过错误继续执行，则将 Promise.reject 前的 return 去除，即可

let factor = true   //非同步的事件成功与否let factor2 = falselet condition = function(something,num) {     if(something) {        return  Promise.resolve('第'+ num +"次成功了");     } else {        return Promise.reject('第'+ num +'次失败QQ');     }}condition(factor,1).then(function(val) {   console.log('1.'+val);   return condition(factor2,2)}).then(function(val) {   console.log('2.'+val);   return condition(factor,3)}).then(function(val) {   console.log('3.'+val);   return condition(factor,4)}).then(function(val) {   console.log('4.'+val);}).catch(error => console.log('错误讯息', error))

Promise.race()範例

let factor = true   //非同步的事件成功与否let factor2 = falselet condition = function(something,num) { return new Promise((resolve,reject)=>{   setTimeout(function(){     if(something) {         resolve('第'+ num +".先成功了");     } else {         reject('第'+ num +'次失败QQ');     }   },Math.floor(Math.random() * 10)*1000) })}Promise.race([condition(factor2,1),condition(factor,2),condition(factor,3)]).then((res)=>{ console.log(res) }).catch(err => { console.log(err)});

Promise.all()範例

//------------------------皆为成功的前提下--------------------------let factor = true   //非同步的事件成功与否let factor2 = falselet timer = Math.floor(Math.random() * 5)*1000let condition = function(something,num) { return new Promise((resolve,reject)=>{   setTimeout(function(){     if(something) {         resolve('第'+ num +".先成功了花了"+timer+'秒');     } else {         reject('第'+ num +'次失败QQ');     }   },timer) })}Promise.all([condition(factor,1),condition(factor,2),condition(factor,3)]).then((res)=>{ console.log(res) }).catch(err => { console.log(err)});//-------------------------------其中一个失败状况下--------------------let factor = true   //非同步的事件成功与否let factor2 = falselet timer = Math.floor(Math.random() * 5)*1000let condition = function(something,num) { return new Promise((resolve,reject)=>{   setTimeout(function(){     if(something) {         resolve('第'+ num +".先成功了花了"+timer+'秒');     } else {         reject('第'+ num +'次失败QQ');     }   },timer) })}Promise.all([condition(factor,1),condition(factor2,2),condition(factor,3)]).then((res)=>{ console.log(res) }).catch(err => { console.log(err)});