首页 > 认识jQuery的Promise

重庆时时彩必中外挂软件,认识jQuery的Promise

互联网 2020-11-30 16:24:33

先前了解了ES6的Promise对象,来看看jQuery中的Promise,也就是jQuery的Deferred对象。

打开浏览器的控制台先。

var defer = $.Deferred();console.log(defer);

运行结果:

和ES6的Promise对象长的有点像,jQuery的Deferred对象也有resolve、reject、then方法,还有done、fail、always......方法。jQuery就是用这个Deferred对象来注册异步操作的回调函数,修改并传递异步操作的状态。

玩玩Deferred:

复制代码 function runAsync(){var defer = $.Deferred();//做一些异步操作setTimeout(function(){console.log('执行完成');defer.resolve('异步请求成功之后返回的数据');}, 1000);return defer;}runAsync().then(function(data){console.log(data)}); 复制代码

 运行之后,Deferred对象的实例defer通过resolve方法把参数 “异步请求成功之后返回的数据” 传回到then方法中进行接收,,打印。

和ES6的Promise相似,但是有一点点区别,再看下Promise:

复制代码 function runAsync(){var p = new Promise(function(resolve, reject){ setTimeout(function(){console.log('执行完成');resolve('异步请求成功之后返回的数据');}, 1000);});return p;}runAsync().then(function(data){console.log(data);}); 复制代码

我们发现:

1、创建Deferred对象的时候没有传参;而创建Promise对象的时候,传了参数(传了一个匿名函数,函数也有两个参数:resolve、reject);

2、Deferred对象直接调用了resolve方法;而Promise对象则是在内部调用的resolve方法;

说明:Deferred对象本身就有resolve方法,而Promise对象是在构造器中通过执行resolve方法,给Promise对象赋上了执行结果的状态。

这样就有一个弊端:因为Deferred对象自带resolve方法,拿到Deferred对象之后,就可以随时调用resolve方法,其状态可以进行手动干预了

复制代码 function runAsync(){var defer = $.Deferred();//做一些异步操作setTimeout(function(){console.log('执行完成');defer.resolve('异步请求成功之后返回的数据');}, 1000);return defer;} var der = runAsync(); der.then(function(data){console.log(data) }); der.resolve('在外部结束');复制代码

 这样的话就直接在外部直接给Deferred设置了状态,打印“在外部结束”,1s后打印“执行完成”,不会打印“异步请求成功之后返回的数据”了。

显然,这不好。我发个异步请求,还没收到数据就让人在外部给我结束了。。。。。。。

当然这个坑jQuery肯定会填的,在Deferred对象上有一个promise方法,是一个受限的Deferred对象

复制代码 function runAsync(){var def = $.Deferred();//做一些异步操作setTimeout(function(){console.log('执行完成');def.resolve('请求成功之后返回的数据');}, 2000);return def.promise(); //就在这里调用} 复制代码

所谓受限的Deferred对象,就是没有resolve和reject方法的Deferred对象。这样就无法在外边改变Deferred对象的状态了。

Deferred对象的then方法和done、fail语法糖

我们知道,在ES6的Promise规范中,then方法接受两个参数,分别是执行完成和执行失败的回调,而jquery中进行了增强,还可以接受第三个参数,就是在pending状态时的回调,如下:

deferred.then( doneFilter [, failFilter ] [, progressFilter ] )

then方法:

复制代码 function runAsync(){var def = $.Deferred();//做一些异步操作setTimeout(function(){var num = Math.ceil(Math.random()*10); //生成1-10的随机数 if(num
免责声明:非本网注明原创的信息,皆为程序自动获取自互联网,目的在于传递更多信息,并不代表本网赞同其观点和对其真实性负责;如此页面有侵犯到您的权益,请给站长发送邮件,并提供相关证明(版权证明、身份证正反面、侵权链接),站长将在收到邮件24小时内删除。

相关阅读