Issue with asynchronous function not returning expected result

I’m working on a JavaScript project where I’m trying to use an asynchronous function to fetch data from an API. However, despite my efforts, the function is not returning the expected result. Here’s the code snippet I’ve tried:

I’m using fetch to get data from an API, and I’m expecting the result to contain the fetched data. However, when I log the result to the console, it’s showing undefined or a pending promise.

I’ve checked the API endpoint, and it seems to be returning valid JSON. Am I missing something in my asynchronous function, or is there a better way to handle asynchronous operations in JavaScript? Any insights or corrections to my code would be greatly appreciated.
My code that I’ve tried:

async function fetchData() {
try {
const response = await fetch('https://api.example.com/data');
const data = await response.json();
return data;
} catch (error) {
console.error('Error fetching data:', error);
return null;
}
}

// Calling the function
const result = fetchData();
console.log('Result:', result);