javascript fetch inside foreach loop to pushing array

Question

When i load the page for the first time, i execute these instructions

var arrayObj = [];  
var marketItems = [];
  
marketItems.push({
    "tokenId": "18",
    "tokenAddress": "0x19d66326c89618e101e106a36710ad4614e15865",
    "tokenUri": "https://uri1...",
});
marketItems.push({
    "tokenId": "19",
    "tokenAddress": "0x19d66326c89618e101e106a36710ad4614e15865",
    "tokenUri": "https://uri2...",
});    

marketItems.forEach(async item => {

  var obj = await fetch(item.tokenUri)
  .then(response => response.json())
  .then(data => {
    obj = { "dataTokenUid": data.uid, "dataTokenId": item.tokenId, "dataTokenAddress": item.tokenAddress, "dataName": data.name, "dataDescription": data.description };
    arrayObj.push(obj);      
  });

});

console.log(arrayObj)

in the first log the array is empty, but without reloading the page if i call the following function i get the right log ..

function callItem () {
   console.log("Arrai costruito");
   console.log(arrayObj);
}

Arrai costruito 
Array [ {…}, {…} ]
0: Object { dataTokenUid: "9", dataTokenId: "18", dataTokenAddress: "0x19d66326c89618e101e106a36710ad4614e15865", … }
1: Object { dataTokenUid: "10", dataTokenId: "19", dataTokenAddress: "0x19d66326c89618e101e106a36710ad4614e15865", … }
length: 2

there is obviously a synchronization problem that i have not been able to solve, i would like to see the array in the log when i load the page, what can I do?

javascript fetch inside foreach loop to pushing array

0 Answers0