今天突然想到了一个有趣的题目,其实应用还是很广泛的。先听题:
有任意四个自然数,比如1,3,5,7。现在假设已经有一个服务器实现了ajax,服务器所做的事情就是把post来的数据加1,然后返回给客户端。这时候已经发送了4个请求。
当客户端得到数据之后,把数据分别乘以1、2、3、4,然后分别发送到服务器,这时候又发送了4x4=16个请求,服务器还是负责加1,处理之后返回给客户端,客户端也会收到16个数据。
然后这16个数据再分别乘以1、2、3、4,然后分别发送到服务器,这时候又发送了16x4=64个请求,服务器还是负责加1,,处理之后返回给客户端,客户端也会收到64个数据。
问1:向服务器发送5轮请求的话,第五轮会发送多少请求?第N轮会发送多少请求?
答:这个还容易,是4的5次方,1024次。N轮的话,就是4的N次方个请求。
问2:编写代码实现这些过程,假设发送4轮,最终打印出所有的服务器返回数据。
server.php:
JS(假设已经引入jQuery):
var fourNumber = [1,3,4,7];
var counter = 0; // 只是一个无聊的计数器,用于印证4 + 4x4 + 4x4x4 + 4x4x4x4 = 340
function post(number, level, index) {
if ( level <= 4 ) {
$.post('server.php', {number:number}, function(data) {
counter++;
console.log(counter + ' level:' + level + ' data:' + data + ' index:' + index);
for (var i = 0; i < 4; i++) {
post(data * (i + 1), level + 1, i);
}
});
}
}
for (var i = 0; i < 4; i++) {
post(fourNumber[i], 1, i);
}
看完你可能一脸懵逼:哪有用promise?
确实没有用到,于是我改写一下。首先声明,这个案例用promise其实是增加复杂度的,这里只是promise用法的一个练习。
首先强调一下,这个案例并不是你想象的Promise.all或者Promise.race,因为链条之间根本是互相独立的,谁也不应该等谁,而Promise.all需要等最慢的那个链条,Promise.race只管最快的那个链条,所以它们在本案例不适用。
事实上,promise用法,就是在上面代码上做一个扩充即可。
var fourNumber = [1,3,4,7];
var counter = 0; // 只是一个无聊的计数器,用于印证4 + 4x4 + 4x4x4 + 4x4x4x4 = 340
function post(number, level, index) {
if ( level <= 4 ) {
new Promise(function(resolve) {
$.post('server.php', {number:number}, function(data) {
counter++;
console.log(counter + ' level:' + level + ' data:' + data + ' index:' + index);
for (var i = 0; i < 4; i++) {
post(data * (i + 1), level + 1, i);
}
});
});
}
}
for (var i = 0; i < 4; i++) {
post(fourNumber[i], 1, i);
}
你可能会问,为什么不干脆连续then四次,直接写完代码?搞个锤子的递归?
就是因为4生16,16生64,64生256,才必须递归,因为new一次只能返回一个promise对象,不可能返回4个对象,不用递归的话只能是单线级联执行,根本不能裂变式生成340个promise对象。
最后,你也可以看到,promise写法除了理解起来更复杂了,代码更多了,并没有什么优势。没错,递归本身就可以解决回调地狱问题,promise也能解决回调地狱问题,能写递归的前提下,promise确实发挥不出长处。而且最关键的是,裂变式级联只能用递归,promise自身根本不可能完成裂变。
总之,promise能不用就不用,必须用的时候要会用。