Promise的用法

  1. Promise的构造函数接收一个参数,是函数,并且传入两个参数:resolve,reject,分别表示异步操作执行成功后的回调函数和异步操作执行失败后的回调函数。
    定义一个promise对象,并不调用它,传进去的函数已经执行了。
 	    var p = new Promise((resolve, reject) => {
                console.log('执行promise');
         });

以上代码将输出“执行promise”。

  1. 在then里如果有reject函数,则上一步的reject()将进入then中的reject函数,否则进入catch中
	       var p1 = () => {
               return Promise.reject('reject');
            };
            p1().then(() => {
                console.log('then resolve');
            }, () => {
                console.log('then reject');
            }).catch(err => {
                console.log('p1 catch', err);
            });

上述代码将输出“then reject”。

		  var p1 = () => {
               return Promise.reject('reject');
            };
            p1().then(() => {
                console.log('then resolve');
            }).catch(err => {
                console.log('p1 catch', err);
            });

上述代码将输出“p1 catch reject”。

  1. 一个promise中如果有catch,则直接进入then参数中的resolve函数中
		  var p1 = () => {
               return new Promise((resolve, reject) => {
                   throw 'reject';
               }).catch(err => {
                   console.log('p1 catch', err);
               });
            }

            p1().then(() => {
                console.log('p1 then resolve');
            }, () => {
                console.log('p1 then reject');
            }).catch(err => {
                console.log('catch', err);
            })

上述代码将输出
p1 catch reject
p1 then resolve

  1. reject和catch
    reject是用来抛出异常的,catch是用来处理异常的
    reject 是 Promise 的方法,而 catch 是 Promise 实例的方法
let p = new Promise()
p.catch()
p.reject() // 没有这个东西
Promise.reject()
Promise.catch() // 没有这个东西
  1. 某些情况下,reject和throw一样,前一个promise存在reject(),会依次寻找下面then中是否有reject函数,若有则执行完reject后进入下面的resolve执行,若都没有则进入catch中。
		  var p1 = () => {
               return new Promise((resolve, reject) => {
                   // throw new Error('reject');
                    reject('reject');    // 这里throw和reject一样
               })
            }

            p1().then(() => {
                console.log('第一个then resolve');
            }).then(() => {
                console.log('第二个then resolve');
            }, () => {
                console.log('第二个then reject');
            }).then(() => {
                console.log('第三个then resolve');
            }, () => {
                console.log('第三个then reject');
            }).catch(err => {
                console.log('catch', err);
            });

上述代码将输出
第二个then reject
第三个then resolve

  1. 第一个函数内部promise的then存在异步请求,这个请求将与该函数的then中的resolve同时执行
		  var p1 = () => {
                return new Promise((resolve, reject) => {
                    console.log('p1');
                    setTimeout(() => {
                        console.log('p1 setTimeout');
                        resolve();
                    }, 500)
                }).then(() => {
                    setTimeout(() => {
                        console.log('p1 then setTimeout');
                    }, 500)
                })
            };
            p1().then(() => {
                console.log('p1 then resolve');
            });

上述代码将输出
p1
p1 setTimeout
p1 then resolve
p1 then setTimeout

如果需要p1中所有代码执行完毕才进入resolve函数中,p1中所有异步均需使用promise

            var p1 = () => {
                return new Promise((resolve, reject) => {
                    console.log('p1');
                    setTimeout(() => {
                        console.log('p1 setTimeout');
                        resolve();
                    }, 500)
                }).then(() => {
                    return new Promise((resolve, reject) => {
                        setTimeout(() => {
                            console.log('p1 then setTimeout');
                            resolve();
                        }, 500)
                    });
                })
            };

上述代码将输出
p1
p1 setTimeout
p1 then setTimeout
p1 then resolve

  1. promise和setTimeout同时使用时根据顺序先执行完所有promise,再执行setTimeout
		  setTimeout(() => {
                console.log('setTimeout 1');
                Promise.resolve().then(() => {
                    console.log('Promise 1');
                })
            }, 10);
            setTimeout(() => {
                console.log('setTimeout 2');
                Promise.resolve().then(() => {
                    console.log('Promise 2');
                });
                var t = new Date();
      	       while(new Date() - t < 50);  // 阻塞50ms,此时第一个setTimeout回调已经进入任务队列               
	       Promise.resolve().then(() => {
                    console.log('Promise 3');
                });
            });

上述代码将输出
setTimeout 2
Promise 2
Promise 3
setTimeout 1
Promise 1

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值