最近工作轻松了点,想起了以前总是看到的一个单词promise,于是耐心下来学习了一下。

一:Promise是什么?为什么会有这个东西?

首先说明,Promise是为了解决javascript异步编程时候代码书写的方式产生的。
随着javascript的发展,异步的场景越来越多。前端有AJAX,setTimeout等,后端Node异步更多。按照传统的做法,那么就是各种回调嵌回调。代码可以把人绕晕。
这个时候,CommonJS社区提出了一个叫做Promise/A+的规范,这个规范定义了如何书写异步代码,包括使用when/then/resolve等来组织异步的代码。
这个规范由于很优雅,所以相继就有很多人实现了这个规范,其中包括 浏览器原生支持的Promise(), jQuery里面的deferred,when.js等。
因为这几个库都符合该规范,所以学习一个也就可以了。我主要学习了jQuery的deferred,所以本文主要讲讲这个实现。
 
二:jQuery的deferred

首先,关于deferred对象,阮一峰老师有篇文章写的很详细了,地址点这。建议可以先看看他的那篇文章,再继续往下看。
上面说过,promise是为了解决异步(比如ajax)的,那么我们来对比下他们的区别。
经典的jQuery的AJAX的写法是

复制代码 代码如下:
$.ajax({
    type: "get",
    url: "",
    success: function () {},
    error; function () {}
});

其中success和error参数便是成功/失败时候的回调函数。 

而现在jQuery的AJAX写法成了

复制代码 代码如下:
$.ajax({
    type; "get",
    url: ""
}).done(function () {}).fail(function () {});

其中成功后会调用done里面的函数,失败便会调用fail里面的函数。 

看到这里也许你就会有疑问了,done/fail这些方法是哪个对象上的?$.ajax()返回了什么对象,为什么有这两个方法?
答案就在下面介绍的Deferred对象。

jQuery提供了一种新的类型Deferred。通过$.Deferred()来生成。例如

复制代码 代码如下:
var def = $.Deferred();

这个def继承了很多方法,有done/fail/resolve/reject等。
所以这里我们也就知道,上面$.ajax()其实返回的也就是这个对象。
 
deferred对象有很多方法,这里介绍几种常用的,更多的可以参考 API
 
首先自然是生成一个def对象。这里有很多方法,比如:

复制代码 代码如下:
var def = $.Deferred();    // 自己生成
$.ajax({});    // ajax方法返回的也是def对象
$.when();    // when方法也会返回一个def对象

这里,$.when()可以单独讲讲,这个方法通常接收一个或多个deferred对象,然后根据这些deferred对象的状态情况,来决定$.when()返回的对象的状态。其中有个使用场景就是多个ajax请求,如果其中一个失败就都算失败,那么便可以在$.when()中传入多个ajax方法,例如$.when($.ajax(), $.ajax())。然后$.when会返回一个def对象(根据这两个请求结果的来判断)。
 
接着得到了def对象,便有了一系列改变这个对象状态的方法

复制代码 代码如下:
def.resolve();    // 把def对象设置成已经完成,然后便会立刻执行绑定在def.done()里面的函数。
def.reject();    // 把def对象设置成已经失败,然后便会立刻执行绑定在def.fail()里面的函数。
def.notify();    // def对象执行中,对应的回调是def.progress()。

紧接着是设置回调的方法,顺序和上面的对应,也就是什么状态会调用到什么回调

复制代码 代码如下:
def.done();    // 对应def.resolve();
def.fail();    // 对应def.reject();
def.progress();    // 对应 def.notify();
// 特殊的
def.always();    // 成功或者失败都会调用
def.then();    // 接受多个函数,按顺序依次是成功(done),失败(fail)和进行中(progress)

其实到这里位置,deferred对象的用法也就差不多了。不过jQuery还提供了几个API

复制代码 代码如下:
// 检查当前状态类
def.isRejected();
def.isResolved();
def.state();

这几个api顾名思义,就不具体讲了,具体可以查看上面给的jQuery API文档。
 
还有一个方法,就是有时候我们希望给外部一个def对象,然后这个对象可以设置各种状态的回调,但是不能改变它的状态,那么就可以用

复制代码 代码如下:
def.promise();

返回一个promiese对象,是deferred对象的子集,可以用done/fail等方法,没有resolve/reject等方法,主要是为了保护不让外部去修改def对象的状态。 

至此,关于promise已经全部讲完,大家现在就可以把它用在自己的项目中了,另外提早给大家拜个早年,祝大家羊年洋洋得意^ ^。

标签:
javascript,异步编程,Promise

免责声明:本站文章均来自网站采集或用户投稿,网站不提供任何软件下载或自行开发的软件! 如有用户或公司发现本站内容信息存在侵权行为,请邮件告知! 858582#qq.com

《魔兽世界》大逃杀!60人新游玩模式《强袭风暴》3月21日上线

暴雪近日发布了《魔兽世界》10.2.6 更新内容,新游玩模式《强袭风暴》即将于3月21 日在亚服上线,届时玩家将前往阿拉希高地展开一场 60 人大逃杀对战。

艾泽拉斯的冒险者已经征服了艾泽拉斯的大地及遥远的彼岸。他们在对抗世界上最致命的敌人时展现出过人的手腕,并且成功阻止终结宇宙等级的威胁。当他们在为即将于《魔兽世界》资料片《地心之战》中来袭的萨拉塔斯势力做战斗准备时,他们还需要在熟悉的阿拉希高地面对一个全新的敌人──那就是彼此。在《巨龙崛起》10.2.6 更新的《强袭风暴》中,玩家将会进入一个全新的海盗主题大逃杀式限时活动,其中包含极高的风险和史诗级的奖励。

《强袭风暴》不是普通的战场,作为一个独立于主游戏之外的活动,玩家可以用大逃杀的风格来体验《魔兽世界》,不分职业、不分装备(除了你在赛局中捡到的),光是技巧和战略的强弱之分就能决定出谁才是能坚持到最后的赢家。本次活动将会开放单人和双人模式,玩家在加入海盗主题的预赛大厅区域前,可以从强袭风暴角色画面新增好友。游玩游戏将可以累计名望轨迹,《巨龙崛起》和《魔兽世界:巫妖王之怒 经典版》的玩家都可以获得奖励。