Hi everyone,
I am learning some javascript and wix velo to build some basic functionality for a website. Of course, I am a complete newbie. I am trying to learn about promises and how to handle them. I am experimenting with a very basic code. For example: I am querying a collection with an id “ImageCollection“. However, when console.log the result from the query, I am just getting promise <>. Any idea why I can’t see the value? What am I doing wrong?
Here is my code:
import wixData from "wix-data";
$w.onReady(function () {
const results = fetchedItems()
console.log(results)
});
async function fetchedItems() {
const queryResults = await wixData.query("ImageCollection").find();
return queryResults
};
Hi, @user5208 !!
You should do it like this. 
$w.onReady(async function () {
const results = await fetchedItems();
console.log(results);
});
Your function fetchedItems uses wixData.query().find() internally, and this process is asynchronous—it takes time to get the result. To use a food analogy, it’s like ordering a hamburger at a burger shop, you don’t receive the hamburger the instant you place the order. Even at McDonald’s, it usually takes at least a few seconds before you get it. In programming, those few seconds are considered a very very long time. 
That’s why, when calling the fetchedItems function to get the result, you need to use either await or .then() to retrieve the data correctly. If you simply use console.log(), you’ll see a Promise. This Promise is like a ticket for a hamburger you’ve ordered—it’s not the actual hamburger yet, but rather a voucher you can exchange for the hamburger a few seconds later. 
Hi @onemoretime ,
Thank you so much! Just one question - since inside fetchedItems() the query is wrapped with await , shouldn’t that wait to get the result first from the query, and only then assign it to queryResults? That means, when I invoke the fetchedItems() function, the first instance of await inside the function should first wait fir the result and only then return it, no?
await 
…
（I’m thinking…）
!!
So your question is whether await is unnecessary when calling fetchedItems. Inside the fetchedItems function, values are reliably obtained using await. For example, if you console.log(queryResults) inside fetchedItems, you will see the actual values. However, since fetchedItems is defined as an async function, the caller still needs to use await or .then() to get the value. This is because an async function doesn’t return a value directly—it returns a Promise. You can think of a Promise as a box containing the value. To access the value, you need to use await or .then(). Using these, the caller can wait inside the onReady callback until fetchedItems actually returns its result. JavaScript was originally designed for building web pages, so it doesn’t automatically run things sequentially unless explicitly told to wait. Imagine opening a web page: if nothing appears for several seconds, it can be frustrating. Humans tend to get irritated when a machine gives no response. However, if a partially loaded image appears while the full image is still loading, people can perceive that progress is happening, reducing frustration. Meanwhile, the asynchronous image-loading process continues in the background. To make good use of this waiting time and keep users engaged, web pages often display something lightweight before the full loading completes. In the web world, it is normal to execute whatever can run immediately—asynchronous processing is the default, unlike stricter languages like Java or Python, which process sequentially by default. Therefore, in JavaScript, when you want a function to truly wait, you have to explicitly tell it to do so. Your question seems to be: since there is an await inside fetchedItems, wouldn’t the function automatically wait until processing finishes before returning to the caller in onReady? The answer is no. Think of it like a Mario Kart racing on a track: a kart starts in the onReady function, enters the fetchedItems course to complete it, and then returns to the main track. To make sure it returns at the correct timing, you need await. If there is no traffic control, the ghost kart might start racing ahead milliseconds after entering the sub-course, before the 2-second challenge in fetchedItems finishes. Since JavaScript fundamentally doesn’t wait, unless you explicitly tell it to, processing will continue immediately. That’s why the caller of fetchedItems also needs to use await.
@onemoretime Thank you so much! That makes more sense now! So, regardless whether my function is asynchronous, and the return value has an “await“ keyword, this function still needs to be wrapped in “await“. If not, the compiler will jump to and try to execute the next line.
I really appreciate your help! 
Thank you!
I don’t fully understand Promises myself, so I might be wrong in some details, but in practice, remembering just this much is enough in most cases. However, overusing await can undermine the strengths of JavaScript and hurt performance, so be careful. For example, if you need to retrieve multiple values, make sure to use Promise.all or similar methods to handle them in parallel.