今天遇到一个需求就是，需要在for循环中，进行axios异步请求。一般这个这个时候就遇到两个问题
-
因为你的请求是在for循环中，而且又是异步的请求所以，请求出来的数据顺序错乱
-
还有就是在for里 等所有的异步请求完成之后，再去处理数据。这时你就会发现。它是先走了异步请求下边的代码，因为这个是线程问题，在一个就是异步的，它不会等着你完成请求之后再去执行。因为JS运行在浏览器中,是单线程的
for (let i = 0; i < 5; i++) {
setTimeout(function() {
console.log(i)
}, Math.random() * 3000)
会发现打印的下标他的顺序是错乱的
解决方案 利用es6 中的 let 和Promise.all方法来解决
biPromise.all方法就是专门来解决 多个异步处理的
biPromise的基础用法看这https://blog.csdn.net/qq_46124502/article/details/106500810
let promiseList = []
for (let i = 0; i < 5; i++) {
promiseList.push(new Promise((resolve, reject) => {
setTimeout(() => {
resolve(i)
}, Math.random() * 3000);
}));
Promise.all(promiseList).then((rspList)=> {
rspList.map((val)=> {
console.log(val);
});
});
当时你也可以用递归去实现。但递归影响运行速度，因为它不是并发的。
如果在所有异步请求完成之后再去处理数据，
let promiseList = []
for (let i = 0; i < 5; i++) {
promiseList.push(new Promise((resolve, reject) => {
setTimeout(() => {
resolve(i)
}, Math.random() * 3000);
}));
Promise.all(promiseList).then((rspList)=> {
rspList.map((val)=> {
console.log(val);
});
}).then(()=>{
console.log("所有异步请求已经完成")
希望可以帮助到你
今天遇到一个需求就是，需要在for循环中，进行axios异步请求。一般这个这个时候就遇到两个问题因为你的请求是在for循环中，而且又是异步的请求所以，请求出来的数据顺序错乱还有就是在for里 等所有的异步请求完成之后，再去处理数据。这时你就会发现。它是先走了异步请求下边的代码，因为这个是线程问题，在一个就是异步的，它不会等着你完成请求之后再去执行。因为JS运行在浏览器中,是单线程的for (let i = 0; i < 5; i++) { setTimeout(function() {
上一篇文章写了使用Promise进行异步操作：使用Promise来进行异步操作。
这适用于单条数据的处理场景，如果是在for循环中处理多条数据，依次处理每条数据的异步操作呢？
思路：还是利用Promise的then()来进行链式操作，每次循环的时候往Promise后添加一个新的then(),这样就可以保证上一个数据的异步操作执行完毕再执行下一个数据的异步操作。
示例代码：
const promise = Promise.resolve();
for(let index in newArray){
promise = promise.then(()=>{
return asyncOp
for循环数组调用同一接口传入不同 id 获取数据，改装数组实现需求。由于接口比较特殊，同时多次调用不稳定，for循环调接口会变成异步执行会报错，所以需要等待上一个请求完成再执行下一次请求，可以采用 for循环 + promise + async await 实现。使用定时器模拟请求：
打印结果：...
问题描述：当我们使用for循环时，里面执行异步操作（比如延时器，接口请求等等），就会出现里面执行的永远是最后一次循环的结果，原因是因为for循环是同步的，当异步操作还没走完，for循环已经全部执行完成了，所以得到的永远是最后一次的结果。
解决办法1（闭包）：
通过闭包来保存每次循环的执行状态
for (var i = 0; i < 5; i++) {
(function(a){
setTimeout(function(){
console.log
// data&&data.map(item=>{
// 通过promise关键字解决 获取数组时元素顺序混乱问题。
for (let i = 0; i < data.length; i++) {
sections.push(new Promise((resolve, reject) => {
request.get(`${HOS...
在一个列表循环里，对数据进行赋值，调用接口，循环外后面的代码需等待所有请求执行完成后再去执行。
2. for await…of实现（推荐）
这种方法是es6新语法，其介绍如下：for…of 针对可迭代对象身上的（array, map, set, string, typedarray, argements）
迭代的是对象列表中的值（value） ，一般情况遍历数组for…in 针对对象的属性进行无序遍历，除了symbol类的属性
遍历的是属性，一般情况适用于对象遍历该方法使用起来，相比Promise.all要
在for循环中，想写一个异步请求数据的函数。因为异步的原因，循环完之后，请求数据只请求了for循环的最后一次，无法实现每次循环都调用一次数据请求。
但是本框架采用的是axios，也并未找到把异步请求改成同步的方法。所以采用递归的方式来实现。
(function loop(index) {
getLists({
province_id:id
}).then(res =>...
for
循环中进行联网请求数据，由于网络请求是异步的，第一个网络请求还没有回调，第二次第三次以及后续的网络请求又已经发出去了，有可能后续的网络请求会先回调；这时我们接收到的数据的排序就会错乱；怎么才能让数据和for
循环进行异步操作之前的顺序一样呢；
1、网络请求使用同步请求，串型请求，等第一个网络请求回调后再去请求第二个；
2、递归迭代，异步的网络请求，在当前请求完成后再去递归请求下一个；
在Vue中使用v-for循环渲染数据时，有时需要将循环的数据分别上传到服务器进行处理。这时可以借助axios库发送异步请求，在请求完成后再进行下一步操作。但是由于axios是异步的，数据上传时可能会出现不同步的情况，导致数据上传失败或者数据顺序打乱等问题。如何解决这个问题呢？
一种解决办法是利用Promise对象的特性，将多个异步请求串联起来，使其按照顺序依次执行。具体步骤如下：
1. 定义一个方法，用于遍历数据并一次发送请求。每次请求返回一个Promise对象。
uploadData(item) {
return axios.post('http://www.example.com/upload', item);
2. 将循环的数据存放在一个数组中，遍历数组，将每个数据都利用uploadData方法上传到服务器，并将返回的Promise对象存放在一个数组中。
let promiseArr = [];
for(let item of dataArr) {
promiseArr.push(this.uploadData(item));
3. 利用Promise的静态方法all()，传入Promise数组，实现所有请求的同步执行。all()返回一个新的Promise对象，该对象的then()方法中传入一个回调函数，用于处理所有请求完成后的数据。
Promise.all(promiseArr).then(results => {
// 处理所有请求完成后的数据
通过这种方法，可以将所有请求变为同步的，保证每个请求都按顺序执行，避免因异步导致上传数据不同步的问题。
此外，也可以考虑使用async/await异步处理方式，async/await是ES2017引入的异步处理语法糖，能够使异步代码像同步代码一样简洁易懂。具体实现方式为，将uploadData方法用async修饰，将Promise对象转化为await表达式，实现异步代码的同步化：
async uploadData(item) {
let res = await axios.post('http://www.example.com/upload', item);
return res.data;
在遍历数据时，利用for...of循环和await表达式，逐个上传数据并等待结果：
for(let item of dataArr) {
let res = await this.uploadData(item);
// 处理每次请求的返回结果
这样可以比较简洁地实现异步请求的同步处理，但是需要注意的是，使用async/await时要确保所有请求之间的依赖关系正确，否则会导致无法同步或死循环等问题。
CSDN-Ada助手:
vue中使用async和await处理异步
不打代码:
js将一位数组分割成每n个一组
小菜鸟的笔记:
js日期排序(使用sort)
几个高兴:
js模板引擎Template.js使用详解及免费下载template.js
