Understanding Simple API call

Hi guys,

Currently i am trying to understand about the API calls, i am fetching the data and i understand it will return as a promise and that promise contains the data and on that JSON-data i can use .json to convert into object or arrays or object.

But in the browser i can only see this [object Promise] , i am just trying to understand the way to show the actual description, as it shows here as Sunny

Thanks in advance :slightly_smiling_face:

let x1 = document.getElementById('apicall')

async function  abc(){

let apicall = await fetch('http://api.weatherstack.com/current?access_key=de129598ee099224e5736e25632c210c&query=New%20York')


    let apidata= await apicall.json()


  //  console.log(apidata.key)


return apidata.current.weather_descriptions[0];


let z1=abc()

x1.innerHTML=`<p>Weather: ${z1} </p>`

async functions always return a promise, even if you return a non-promise value from within them. If a non-promise is returned, its wrapped in a promise. As a result, you always have to wait for that promise to resolve to get its value.

  .then(z1 => {
    x1.innerHTML=`<p>Weather: ${z1} </p>`