Understanding Simple API call

programming
1

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')

console.log(apicall)

    let apidata= await apicall.json()

    console.log(apidata)

  //  console.log(apidata.key)

console.log(apidata.current.weather_icons[0])

return apidata.current.weather_descriptions[0];

    }

let z1=abc()

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

wetherapp
wetherapp1682×840 352 KB

2

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.

abc()
  .then(z1 => {
    x1.innerHTML=`<p>Weather: ${z1} </p>`
  });
2 Likes