在实际开发中，一定有情况是这样的，一个页面我们有多个地方请求了ajax，在这种情况下，我们要实现数据没来之前出现我们炫酷的loading效果，而且要等到所有的ajax都请求完毕后，才让我们的loading效果消失，那么问题来了，每个ajax请求数据的时间都是不确定的，我们这个loading效果结束的逻辑又应该放到哪里呢？就好比这样（伪代码模拟）：

console.log('loading效果图旋转中')     var timer1 =  setTimeout(() => {         console.log('第一个加载完成了');     }, '随机的时间');     var timer2 =  setTimeout(() => {         console.log('第二个加载完成了');     }, '随机的时间');     var timer3 =  setTimeout(() => {         console.log('第三个加载完成了');     }, '随机的时间');      console.log('loading效果图消失,我好慌，我应该放到哪里')

　　是不是很难受，你说每个请求的结束时间都不确定，我哪知道我应该放到哪里结束，别怕，给大家提供两种解决方案，为了逻辑清晰，我就用一个延时器来给大家进行模拟了，莫要嫌弃:)

　　第一种解决方案：我们设置一个标识，比如loadingNums，当loadingNums等于0的时候，我们让loading消失，接下来看代码（应该用await和async来模拟的，但是重要的是思路，其他的不重要，你懂的）：

var loadingNums = 3;     console.log('loading效果图旋转中')     var timer1 =  setTimeout(() => {         console.log('第一个加载完成了');         loadingNums--;         if(loadingNums==0){             console.log('loading效果图消失')         }     }, 1000);     var timer2 =  setTimeout(() => {         console.log('第三个加载完成了');         loadingNums--;         if(loadingNums==0){             console.log('loading效果图消失')         }     }, 2000);     var timer3 =  setTimeout(() => {         console.log('第二个加载完成了');         loadingNums--;         if(loadingNums==0){             console.log('loading效果图消失')         }     }, 3000);

 页面控制台打印效果：

 

  　　第二种解决方案：我们可以用ES6的Promise，如果有不了解Promise的同学自行去查询相关文档，接下来开始我们的操作，Promise有一个all方法，接收一个参数，这个参数我们可以传一个数组，在这个数组中我们可以写多个Promise，看到这里你应该明白了，我们可以把所有的异步操作都用Promise包起来，然后都放到这个数组内（漂亮，给自己的聪明才智鼓个掌好不好），如你所想，这个all方法是可以等到数组中所有的Promise加载完成之后才去执行的，那还等什么，准备发车，看代码：

console.log('loading效果图旋转中')     var p1 = new Promise(

                    

                        
关键字：