网站建设深,做网站杭州傲视信息,网站是空间备案,比较流行的sns营销网站场景是这样的#xff1a;
在一个列表循环里#xff0c;对数据进行赋值#xff0c;调用接口#xff0c;循环外后面的代码需等待所有请求执行完成后再去执行。
1. Promise.all实现 Promise.all() 方法接收一个 promise 的 iterable 类型#xff08;注#xff1a;Array
在一个列表循环里对数据进行赋值调用接口循环外后面的代码需等待所有请求执行完成后再去执行。
1. Promise.all实现 Promise.all() 方法接收一个 promise 的 iterable 类型注ArrayMapSet 都属于 ES6 的 iterable 类型的输入并且只返回一个Promise实例那个输入的所有 promise 的 resolve 回调的结果是一个数组。这个Promise的 resolve 回调执行是在所有输入的 promise 的 resolve 回调都结束或者输入的 iterable 里没有 promise 了的时候。它的 reject 回调执行是只要任何一个输入的 promise 的 reject 回调执行或者输入不合法的 promise 就会立即抛出错误并且 reject 的是第一个抛出的错误信息。 伪代码如下
const pro []
//一个列表循环
this.EarDataGrid.instance.getSelectedRowsData().forEach((item, index) {// 取需要的数据const { BatchID, BatchName} itemlet empty {};empty[BatchID] BatchID //同步代码修改empty[BatchName] BatchName// 根据BatchID去请求xx接口将请求合并用all请求pro.push(new Promise((res, rej) {this.odataContext.bizBatchSetExpand.byKey(BatchID).then(r {res(r[0])})}))}});//根据刚刚push的all请求
Promise.all(pro).then((res) {//在这就可以等所有的返回结果可以得到// do some thing...})
2. for await…of实现推荐
这种方法是es6新语法其介绍如下 for await…of 语句创建一个循环该循环遍历异步可迭代对象以及同步可迭代对象包括内置的 String, Array类似数组对象 (例如 arguments 或 NodeList)TypedArray, Map, Set 和用户定义的异步/同步迭代器。它使用对象的每个不同属性的值调用要执行的语句来调用自定义迭代钩子。 类似于 await 运算符一样该语句只能在一个async function 内部使用。 for…of 针对可迭代对象身上的array, map, set, string, typedarray, argements 迭代的是对象列表中的值value 一般情况遍历数组 for…in 针对对象的属性进行无序遍历除了symbol类的属性 遍历的是属性一般情况适用于对象遍历
该方法使用起来相比Promise.all要简洁的多十分好用
代码示例如下
/**根据批次调健康管理接口 */
async handleHealthApi() {// 使用for await...of实现处理异步操作for await (let item of this.batchList) {let params ?$filterBatchID eq ${item.BatchId}$orderbyImmunityDate;let { value } await immtipApi.ImmunityPromptBatch(params)// do some thing...}
},变量控制
这种方法不推荐很不推荐建议优先使用官方推出的语法这种写法会产生没必要的if维护起来会越来越麻烦。
list.forEach(function (item, i) {setTimeout(() {//模拟异步回调中count;console.log(执行请求ing);//执行完所有异步操作if (count list.length) {console.log( 请求执行完成✅,)// do some thing...}}, i)
})写在最后
觉得有用 点个赞吧
