Promise简单学习 ,备忘
Promise用同步的写法解决了异步回调金字塔的问题
如
getData1(data1 => { getData2(data1, data2 => { getData3(data2, data3 => { getData4(data3, data4 => { getData5(data4, data5 => { // 终于取到data5了 }) }) }) }) })
用Promise
getData1() .then(getData2) .then(getData3) .then(getData4) .then(getData5) .then(data => { // 取到最终data了 })
基础用法
let p = new Promise((resolve, reject) => { // 做一些事情 // 然后在某些条件下resolve,或者reject if (/* 条件随便写^_^ */) { resolve() } else { reject() } }) p.then(() => { // 如果p的状态被resolve了,就进入这里 }, () => { // 如果p的状态被reject })
- new Promise能将一个异步过程转化成promise对象。先有了promise对象,然后才有promise编程方式。
- .then用于为promise对象的状态注册回调函数。它会返回一个promise对象,所以可以进行链式调用,也就是.then后面可以继续.then。在注册的状态回调函数中,可以通过return语句改变.then返回的promise对象的状态,以及向后面.then注册的状态回调传递数据;也可以不使用return语句,那样默认就是将返回的promise对象resolve。
- .catch用于注册rejected状态的回调函数,同时该回调也是程序出错的回调,即如果前面的程序运行过程中出错,也会进入执行该回调函数。同.then一样,也会返回新的promise对象。
- 调用Promise.resolve会返回一个状态为fulfilled状态的promise对象,参数会作为数据传递给后面的状态回调函数
- Promise.reject与Promise.resolve同理,区别在于返回的promise对象状态为rejected
模拟红绿灯
componentDidMount(){ function red(){ console.log("red"); } function yellow(){ console.log("yellow"); } function green(){ console.log("green"); } let light = (fn,timer) => new Promise(resolve=>{ setTimeout(function(){ fn(); resolve(); },timer) }) function start(){ Promise.resolve().then(()=>{ light(red,3000) }).then(()=>{ light(yellow,5000) }).then(()=>{ light(green,8000) }) } start(); }
我写在react项目里test
记录下来备忘。