码迷,mamicode.com
首页 > 其他好文 > 详细

ES6知识整理(8)--Promise对象

时间:2018-06-27 00:54:14      阅读:227      评论:0      收藏:0      [点我收藏+]

标签:传参   1.4   rgb   状态   ima   技术   xib   多重   alt   

技术分享图片

(关于promise,以前并不知道是什么,没这个概念。现在来学习总结下)

技术分享图片

promise含义


es6的异步编程解决方案。需要new新对象操作api。

promise对象特点


有3中状态:pending(进行中)、fulfilled(已完成)、rejected(已失效),异步操作才有的状态。


2种状态的改变结果,称为:已定型(resolve):

技术分享图片

即可将异步操作变为同步操作,避免层层嵌套回调函数。


promise缺点:

对象创建后会立即执行,中途不可中断。

不设置回调时,将抛出异常,不影响外部执行。

promise用法


使用方法:

技术分享图片

resolve作用:pending-->resolved 传参:异步成功的data

reject作用:pending-->rejected 传参:error对象


技术分享图片

若a=true;就会进resolve()函数,then中将会进data

若a=false;就会进reject()函数,then中将会进err。

promise执行顺序


对象.then()

技术分享图片

log输出顺序:1 3 2


new之后直接.then()

技术分享图片

log输出顺序:2 1


直接return resolve(),就只执行回调,后面的不再执行。

技术分享图片

因为前面return了 所以只会输出1


异步操作例子


异步加载图片:

技术分享图片

若图片路径存在,则输出value为img对象

若图片路径不存在或错误,则输出err为Error 加载失败


异步操作ajax:

json数据:

技术分享图片

getJson函数带上参数url,可以返回该json数据。

若获取到数据,返回数据;

若访问不到数据,进入then的error,打印:

Error at XMLHttpRequest.xhr.onreadystatechange

技术分享图片

调用getJson(url),then中成功则进data,失败则进err。

promise多重异步


创建一个promise的ajax

技术分享图片


创建多重异步(2个then,第2个getJson使用return):

技术分享图片

结果:

技术分享图片

这个是简洁版本:

技术分享图片

结果是一样的(两重异步):

技术分享图片


Network中:

技术分享图片


技术分享图片

一句:别让自己的努力只是感动了自己。


----公众号:海瑞菌

技术分享图片

ES6知识整理(8)--Promise对象

标签:传参   1.4   rgb   状态   ima   技术   xib   多重   alt   

原文地址:https://www.cnblogs.com/wuhairui/p/9231882.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!