No estoy seguro de por qué await no funciona para mí, ¿alguien puede ayudarme? Seguí algunas guías y lo copié exactamente igual, pero aún no funciona. Necesito que se complete la matriz CardsID antes de llamar a console.log (CardsID.length)
código:
"[LL_REPTAG_URLPREFIXFULL /]/api/v2/businessworkspaces?where_workspace_type_id=54"; async function postData() { let response = await fetch(url, { method: "GET", // *GET, POST, PUT, DELETE, etc. headers: { "Content-Type": "application/json", OTCSTicket: "[LL_REPTAG_OTCSTICKET /]", }, //body: JSON.stringify(data) // body data type must match "Content-Type" header }); return await response.json(); } //(async function(){ postData().then(function (data) { // Log the data to the console // You would do something with both sets of data here //console.log(data); data.results.forEach((element) => { CardsID.push(element.data.properties.id); console.log("added"); }); }); //})(); console.log(CardsID.length); console.log(CardsID);``` result (console): 0 [] [] [] 24 addedEstá llamando a console.logs inmediatamente después de la llamada postData(), que es asíncrona (bueno, promete) y, por lo tanto, no esperará a que finalice la ejecución. O bien, debe colocar console.logs dentro del controlador entonces, así:
postData().then(function (data) { data.results.forEach((element) => { CardsID.push(element.data.properties.id); console.log("added"); }); console.log(CardsID.length); console.log(CardsID); });O (en aras de la coherencia), puede hacer que todo sea asíncrono/en espera, por ejemplo:
async function postData() { const response = await fetch(url, { method: "GET", // *GET, POST, PUT, DELETE, etc. headers: { "Content-Type": "application/json", OTCSTicket: "[LL_REPTAG_OTCSTICKET /]", }, }); return await response.json(); } async function run() { const data = await postData(); const CardsID = []; for (const element of data.results) { CardID.push(element.data.properties.id); console.log("added"); } console.log(CardsID.length); console.log(CardsID); } run();El problema es que el código en el postData().then se ejecuta de forma asíncrona, después de que se resuelve la promesa. La instrucción console.log(CardsID.length) se ejecutará antes de que se ejecute el bloque then .
Para solucionarlo, puede ejecutar la instrucción console.log en la devolución de llamada de la promesa.
postData().then(function (data) { data.results.forEach((element) => { CardsID.push(element.data.properties.id); console.log("added"); }); // move the console.log statement here console.log(CardsID.length); console.log(CardsID); });Solo recuerde que su código debajo del bloque .then se ejecutará antes de que se resuelva porque Javascript espera para resolver pero continúa a través de su ejecución síncrona para ejecutar el código debajo de cualquier código asíncrono.