Promise精简总结

前言 : 个人总结，不是教程，如有错误，欢迎各位批评指正。

 

主要作用:

　　 解决回调地狱

 

简单使用

// 创建Promiselet p = new Promise((resolve, reject) => { let i = Math.random(); if (i < 0.5) resolve("a"); else reject("b");});// resolve传递的参数进入第一个回调函数，reject传递的进入第二个回调函数p.then((arg) => console.log("resolve === ",arg), (arg) => console.log("reject === ",arg)); // 与上面代码等价p.then((arg) => console.log("resolve === ",arg)).catch((arg) => console.log("reject === ",arg))

 

Promise属性

　　PromiseState:

　　　　1.padding : 未决定

　　　　2.resolved / fullfilled : 成功

　　　　3.rejected 失败

　　　　resolve/reject调用前状态为pending, 调用后分别对应状态 2 , 3　　

 　　　   promise中抛出错误会将promise状态改变为rejected

 

　　PromiseResult

　　　　保存着 resolve/reject调用时 传递的结果

 

工作流程

　　

 

 

 

 

 

方法

　　Promise.resolve(value) 

　　作用:用于快速创建Promise,如果传入的参数为非promise，则返回一个fullfilled类型的,值为value的promise。若传入值为promise，则返还的promise状态与值与传入的promise相同

　　

let p1 = Promise.resolve(123);p1.then(console.log)// 123let p1 = Promise.resolve(new Promise((resolve,reject) => { resolve(456);}));p1.then(console.log);// 456let p1 = Promise.resolve(new Promise((resolve,reject) => { reject(789);}));p1.catch(console.log)// 789

　　

　

Promise.reject(value) 

　　作用:用于快速创建Promise,如果传入的参数为非promise，则返回一个rejected类型的,值为value的promise。若传入值为promise，则返还类型为rejected，值为传入的promise的promise对象

 

　

let p1 = Promise.reject(new Promise((resolve,reject) => { resolve(123);}));p1.catch(console.log)// Promise { 123 }

　　

　Promise.all(promises)   

　　作用:传入promises数组，若promises全为fullfilled类型，返回类型为fullfilled，值为promises结果组成的数组。若有一个失败，则返回类型为rejected，值为按数组传入顺序第一个失败的promise的值

 

let p1 = Promise.resolve("hello");let p2 = Promise.resolve("a");let p3 = Promise.resolve("b");Promise.all([p1,p2,p3]).then(console.log);// [ 'hello', 'a', 'b' ]p1 = Promise.resolve("hello");p2 = Promise.reject("a");p3 = Promise.reject("b");Promise.all([p1,p2,p3]).catch(console.log);// a

 

Promise.all(promises)   

　　作用:传入promises数组，返还第一个改变状态的promise的状态与值

 

let p1 = new Promise((resolve, reject) => { resolve("ok");})let p2 = Promise.resolve("a");let p3 = Promise.resolve("b");Promise.race([p1, p2, p3]).then(console.log);// okp1 = new Promise((resolve, reject) => { setTimeout(() => {  resolve("ok"); }, 1000);})p2 = Promise.resolve("a");p3 = Promise.resolve("b");Promise.race([p1, p2, p3]).then(console.log);// a

 

then 方法:

let p = Promise.resolve("ok");let p1 = p.then(value => { console.log(value);})console.log(p1);/** Promise {<pending>} __proto__: Promise [[PromiseState]]: "fulfilled" [[PromiseResult]]: undefined*/let p = Promise.resolve("ok");let p1 = p.then(value => { throw("wrong")})console.log(p1)/** Promise {<rejected>: "wrong"} __proto__: Promise [[PromiseState]]: "rejected" [[PromiseResult]]: "wrong"*/let p = Promise.resolve("ok");let p1 = p.then(value => { return "ok"})console.log(p1)/** Promise {<pending>} __proto__: Promise [[PromiseState]]: "fulfilled" [[PromiseResult]]: "ok"*/// 返回promise 则p1即为返回的promise 代码略

注意：

　　1.利用then方法返回新的promise可以进行then的链式调用，链式调用中存在异常穿透，即只需在最后直接catch，即可捕获所有then中可能出现的异常

　　2.中断promise.then的链式调用，在其中一个then中返还一个pending状态的promise即可， new Promise(() => {}); 

 

async & await:

　　async: 修饰一个函数，根据返回值构建出一个Promise，规则同then

　　 await:只能在async修饰的函数中调用

　　　　1.右侧值为fullfilled的promise对象，获得其值

　　　　2.右侧值为rejected的promise对象，抛出错误

　　　　3.右侧为值，直接返回该值

注意:

　　1.promise中的方法在被创建时会被同步执行

new Promise((resolve, reject) => { console.log(1);});console.log(2);// 输出: 1 2

 

        2.如果不设置回调函数，Promise 内部抛出的错误，不会反应到外部。

new Promise((resolve,reject) => { throw "出错了"}).catch(console.log)// 出错了

 

原文转载：http://www.shaoqun.com/a/543582.html

跨境电商：https://www.ikjzd.com/

鸥鹭：https://www.ikjzd.com/w/2568

邮乐网购物商城：https://www.ikjzd.com/w/1776

前言:个人总结，不是教程，如有错误，欢迎各位批评指正。主要作用:　　解决回调地狱简单使用//创建Promiseletp=newPromise((resolve,reject)=>{leti=Math.random();if(i<0.5)resolve("a");elsereject("b");});//resolve传递的参数进入第一个回调函数，
ryder：ryder
捷汇：捷汇
亚马逊欧洲站VAT风云！德国刚告一段落，法国又要沦陷了吗？：亚马逊欧洲站VAT风云！德国刚告一段落，法国又要沦陷了吗？
如何提升移动端流量？亚马逊手机端运营技巧汇总来啦！：如何提升移动端流量？亚马逊手机端运营技巧汇总来啦！
亚马逊推出Amazon Posts，正式进军社交电商：亚马逊推出Amazon Posts，正式进军社交电商