前端异步API调用

问题的起因:参见耗子的原贴1 & 原贴2

耗子的测试页面上之前的5个方法,原本那个错的就不说了,闭包方法在返回延时有波动的情况下无法保证显示顺序;递归方法和自制Async每一次请求都要等待一次,效率过低;最后的@雪飞霜舞的数组方法和我最早贴出的gist 思路是一样的:在修正xss_rpc_call的前提下,把返回的值按照请求发出顺序储存在一个数组里,等待所有请求都完成,一次性打印结果。我们把这个方法称作 Wait All。

但这样的解决方案有个问题,那就是在api端返回延迟波动很大的情况下,用户会要等待很久才能看到结果。理想的方案应该既保证数据显示的顺序,又保证以最快的速度显示能显示的所有数据。这里提供了此方案的实现,称之为ASAP (as soon as possible)。

算法的思路简单来说就是每个异步请求都要遵循两条规则:

  1. 接收到返回的时候,只有当我前一个请求已经返回并输出了我才能输出,不然就先等着。
  2. 按照规则1,在我输出之前,我后面的请求都不可能输出。所以在我输出之后,如果我的后一个请求已经返回,它也应该输出。这条规则是递归的。

这两条规则已经足以满足我们的需求,同时带来的计算负担几乎可以忽略。具体实现见本页源码。

可以用下面的按钮比较两个方案的显示输出:

模拟随机返回延迟 (0 ~ 1000ms,会打乱返回的顺序)