//多文件上传 function jabingp_upLoad(uploadurl, files) { return new Promise((resolve, reject) => { //初始化promise链 var mergedAjax = Promise.resolve(); var response = []; // 循环上传 // 这里一定要使用let来为没一次循环构建一个块级作用域 // 使用var则需要配合立即执行函数 for (let i = 0; i < files.length; i++) { mergedAjax = mergedAjax.then(() => { return jabingp_upLoadSingle(uploadurl, files[i]).then((res) => { response.push(res); }); }); } //当前面循环中所有的then执行完毕时会执行这个then mergedAjax.then(() => { resolve(response); //设置这个函数的promise对象为完成状态并放入数据 }); }); }
通过这个函数，就完成了多个请求依次执行并收集结果的效果。这个函数的重点在于利用另外一个已经处于完成状态的promise，不断的迭代自身，在每次迭代的then内部通过return来完成辅助链到业务链的切换。
2019-04-27 更新
使用await/async更加优雅地处理异步吧！
在es7标准中，引入了await和async这对兄弟，它们可以让我们的异步代码看起来和同步代码一样。让我们来看看await和async都能做什么吧。
await可以等待一个promise运行到完成状态并且获取结果，或者等待一个async修饰的函数运行完成并获取结果，但是使用await的时候，必须在async函数体内部。比如我有这样一个网络请求:
function postRequest(posturl, postdata) { return new Promise((resolve, reject) => { wx.request({ //省略其他属性 success: function (res) { console.log("at post request: 请求成功") resolve(res.data)//设置promise成功标志 }, fail: function (res) { console.log("at post request: 请求失败") reject(res.data)//设置promise失败标志 } }) }); }
那么如果不使用await，我就需要这样取得请求结果
function test(){ postRequest(xxx,xxx).then(function(res){ // 这里面可以读取请求结果res了 console.log(res); }); } test();
可以看到，这样的代码不太符合常规逻辑，我们希望函数作用是返回数据，这样更清晰明了，有了await，我们的愿望就可以实现了。
async function test(){ let res = await postRequest(xxx,xxx); // 下面就可以正常写对res的读取了 console.log(res); } test();
注意我给函数加上了async，有了async和await，我们就可以像同步代码一样使用异步请求了~
那么上面那个通过复杂的构建链完成的需求，通过await实现将会变得非常简单易懂。
async function jabingp_upLoad(uploadurl, files) { let response = []; // 循环依次等待上传结果 for (let i = 0; i < files.length; i++) { let res = await jabingp_upLoadSingle(uploadurl, files[i]); // 结果放入数组 response.push(res); } // 返回结果 return response ; }
代码一下子变得简洁易懂了，注意调用的时候也同样需要在一个async函数内部执行await。
async function test(){ let response = await jabingp_upLoad(xxx,xxx); console.log(response ); } test();
是不是非常简单呢，赶紧在你的异步请求中使用async和await吧~