解决金字塔回调问题的两种手段

javascript确实是一门在设计和使用上与主流语言上有着很多区别的语言,但一点也不妨碍她成为一门优雅的语言. 但是习惯了顺序执行的coder(指我自己)使用javascript的异步操作容易产生金字塔回调的问题(无止尽的回调套回调).最常见的就是按顺序异步操作.

ajax(url1, function(){
    ajax(url2, function(){
        ...
    });
});

之前遇到这个问题时,我想到了小时候玩的多米诺骨牌,确保前一个倒下能推到自己,自己倒下以后能推到后面一个.(以jQuery的自定义事件方式实现).

jQuery(obj).on('setup1', function(){
    ajax(url1, function(){
        jQuery(obj).trigger('setup2');
    });
});

jQuery(obj).on('setup2', function(){
    ajax(url2, function(){
        jQuery(obj).trigger('setup3');
    });
});

...

后来有人提出了Promise(貌似已经纳入了es6,并且已经有部分浏览器实现了),我的理解就是在一个执行对象中加入了两种状态:成功,失败.执行完成后会调用对应的callback,jQuery在1.5已经有了类似的实现,叫做Deferred.

jQuery.Deferred(function(def){
    ajax(url1, function(){
        def.resolve();
    }, function(){
        //failed
        def.reject();
    });
}).done(function(){
    ajax(url2, function(){
        ...
    });
}).fail(function(){
    //失败处理
});

其实我觉得和我之前用的那种方式比较像.

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏lonelydawn的前端猿区

javascript生成.xls文件(兼容IE&Chrome&Firefox)

贴代码,一切尽在注释中 <html> <head> <meta charset="utf-8"> </head> <body> <input ...

1736
来自专栏啸天"s blog

微信内置浏览器自动跳转其它浏览器

1613
来自专栏IMWeb前端团队

移动端重构实战系列5——form元素

form 大概要实现的效果如下图(具体demo可见sheral form): ? 粗略一看,跟line list差不多,好像可以直接套用,但是深究起来还是有那么...

2135
来自专栏前端知识分享

第120天:移动端-Bootstrap基本使用方法

```   ├─ /weijinsuo/ ··················· 项目所在目录   └─┬─ /css/ ···················...

964
来自专栏极乐技术社区

微信小程序开发心得第二章:千里传音(模板消息)

今天分享一篇关于消息模板的简易教程。 老规矩先把官方的定义再讲一下,消息模板是基于微信的通知渠道,为我们开发者提供了触发模板消息的能力,以便实现服务的闭环和更好...

19911
来自专栏用户2442861的专栏

关于Div的宽度与高度的100%设定

正像你所知道的那样,设置DIV大小的有两个属性width和height,以前在学习DIV每次给DIV设置100%宽度或高度时都很迷惑,不明确这个100%的宽度...

342
来自专栏Coding01

推荐一款快速生成海报的微信小插件

现在很多小程序都有生成海报,分享海报的功能。我们自己的几个小程序 (如:爸妈搜商城、爸妈搜云课堂、幼师大学、跟着外教学英语等) 也都有生成海报的功能。因此技术团...

1193
来自专栏互联网杂技

移动端开发的一些技巧

开篇语 最近接手了一个移动端的项目。个人感觉是自己做得比较快而且比较健壮的一个。。。移动端最主要就是页面要适用不同的手机屏幕,ipad等。下面就分享一些技巧,让...

26210
来自专栏Python研发

CSS

CSS是Cascading Style Sheets的加简称,中文称为层叠样式表,用来控制网页数据的表现,可以使网页的表现与数据内容分离。

913
来自专栏姬小光

姬小光前端小讲堂【第007期】- 切图大法之表格布局

前面几期中,我们已经了解到了前端开发的三板斧,即 HTML,CSS,Javascript。熟练掌握这三个基本技能,基本上就可以混口饭吃了。

912

扫码关注云+社区