在Array.map之后运行一个函数

如何解决在Array.map之后运行一个函数

一旦Array.map完成执行，我想运行一个异步函数。

我正在updateMaterials函数的map方法中进行异步调用，我的目标是在updateMaterials完成执行后调用addDataToDB。

功能1：updateMaterials

 const updateMaterials = recipeRawMaterials => {
    recipeRawMaterials.map((item,index) => {
      updateRawMaterialsDB(item._id,item.rate,index);
    });
  };

异步功能：updateRawMaterialsDB

const updateRawMaterialsDB = async (id,rate,index) => {
    console.log(state.recipeRawMaterials);
    const body = JSON.stringify({
      rate
    });

    console.log(body);

    const config = {
      headers: {
        'Content-Type': 'application/JSON'
      }
    };

    const res = await axios.put(`/api/v1/rawMaterial/${id}`,body,config);

   
  };

 const addDataToDB = async (recipeName,recipeRawMaterials) => {
   

    const config = {
      headers: {
        'Content-Type': 'application/JSON'
      }
    };

    const res = await axios.post('/api/v1/basicRecipe',config);
    setLoading();
    
  };

解决方法

您可以在地图中返回Promise，在Promise完成后，您可以调用addDataToDB函数

const updateMaterials = recipeRawMaterials => {
   const promises =  recipeRawMaterials.map((item,index) => updateRawMaterialsDB(item._id,item.rate,index));
   Promise.all(promises).then(()=>{
       // addDataToDB 
   })
   .catch(e=>{
       //
   })
  };

,

更常见的方法是使用@Ubeyt Demir的答案，该答案将异步调用收集到一个Promise集合中，然后在这些Promise被解决后触发最终调用。

此答案使用ES2018中的功能，您可以在其中使用异步迭代器。这在ECMA提案https://2ality.com/2016/10/asynchronous-iteration.html

中很好地列出了

因此使用；

for await (const asyncItem of asyncCollection) {
  console.log(asyncItem);
}
console.log("done")

当异步承诺的迭代器已解决时，我们将打印“ done”语句。 在您的代码中使用它的外观如下：

items = [{_id: 1,rate: 2,index: 0},{_id: 2,rate: 3,index: 2},{_id: 3,rate: 4,index: 3},{_id: 4,rate: 5,index: 4},{_id: 5,rate: 6,index: 5},]

function sleep(ms) {
    return new Promise(resolve => setTimeout(resolve,ms));
}
const updateRawMaterialsDB = async (id,rate,index) => {
    const body = JSON.stringify({
        rate
    });
    console.log(body);
    const config = {
        headers: {
            'Content-Type': 'application/JSON'
        }
    };
    //return axios.put(`/api/v1/rawMaterial/${id}`,body,config);
    return sleep(2000);
};
async function addDataToDB(recipeName,recipeRawMaterials) {
    const config = {
        headers: {
            'Content-Type': 'application/JSON'
        }
    };
    //const res = await axios.post('/api/v1/basicRecipe',config);
    //setLoading();
    console.log('All done');
};

async function updateMaterials(recipeRawMaterials) {
    const arrayofPromises = recipeRawMaterials.map((item,index) => {
        updateRawMaterialsDB(item._id,index);
    });
    for await (const item of arrayofPromises) {
        console.log("item done");
    }
    addDataToDB('something',recipeRawMaterials)
}
updateMaterials(items);

,

您不必等待每个 +---------+-----------------------------------------------------------------------------------------------------+ | col1| col2| +---------+-----------------------------------------------------------------------------------------------------+ | 100|[('abc','customer'),('product_b','product'),('xyz',('product_a','product')] | | 101|[('mno','customer') | +---------+-----------------------------------------------------------------------------------------------------+ Output: +---------+----------------+-------------------------+ | col1| customer| product | +---------+------------------------------------------+ | 100|['abc','xyz'] |['product_b','product_a'] | 101|['mno'] | | +---------+------------------------------------------+ root |-- col1: string (nullable = true) |-- col2: array (nullable = true) | |-- element: string (containsNull = true) 完成，而应将Promise转换为承诺数组，然后将其传递给recipeRawMaterials，后者接受承诺数组，并返回一个。 / p>

Promise.all