Estoy tratando de crear una aplicación muy simple usando Web3 y JS. Básicamente, la aplicación debe devolver las identificaciones de los tokens que un usuario determinado que está interactuando con ella tiene en su billetera y mostrar las imágenes relativas. Aquí me interesa la primera parte. No creo que esta sea la forma más eficiente de hacerlo (muchas llamadas), pero aún así:

 const getOwnerOf = (owner) => { let ownedTokensArray = []; for (let i = 1; i < 3333; i++) { let ownerAddress = blockchain.smartContract.methods.ownerOf(i).call(); ownerAddress .then(function(result){ console.log(result); // returns a wallet address (eg 0x476e62b30E2587Ea937C19e2b60781e334fa29d7) if (String(result) === String(owner)) { ownedTokensArray.push(i); } }) } console.log(ownedTokensArray); // should return an array of IDs but instead is [] }

Una vez que haya recopilado todas las ID en ownedTokensArray , me gustaría hacer otra función con más o menos la misma lógica, donde itere sobre la matriz de ID y busque una API usando las ID para mostrar la imagen datos conectados a los tokens correspondientes.

El problema es que ownedTokensArray es [] y aunque he adivinado más o menos los conceptos detrás de las llamadas asincrónicas, todavía tengo dificultades. ¿Tengo que seguir anidando la función usando .then() ? ¿Hay una forma más conveniente (tanto en términos de sintaxis como lógica) de hacer esto? ¿Por qué las llamadas asincrónicas son tan difíciles de entender a fondo?

Muchas gracias por tu tiempo.