Regarding Movie Finder Project

#1

I would like to know the importance of the usage of the await fetch(URL) method when we have the XMLHttpRequest option to fetch data asynchronously in JS and one more thing, what is this .Search inside the function call [showMovies(respData.Search)] in line no.19 and what does it exactly do?

imp
imp1023×888 57.2 KB

#2

It will be nice if someone could clear my doubts. Thank you

#3

Hi @Ka_0102 ,

You can use XMLHttpRequest, but using fetch is much more simple. Fetch is a promise-based API and makes code much simpler.

async function getMovies(url) {
const resp = await fetch(url)//gets the data from the api
const respData  = await resp.json();//converts it into json
}

Check out this video to learn more about fetch API and this to learn more about promises.

Have a look at the response from the API, it’s in JSON format. Here Search is a key to the array of movies, that’s why we write respData.Search, so we directly pass in the array of movies in the showMovies(movies) function.

{"Search":[{"Title":"Jurassic Park","Year":"1993","imdbID":"tt0107290","Type":"movie","Poster":"https://m.media-amazon.com/images/M/MV5BMjM2MDgxMDg0Nl5BMl5BanBnXkFtZTgwNTM2OTM5NDE@._V1_SX300.jpg"},{"Title":"The Lost World: Jurassic Park","Year":"1997","imdbID":"tt0119567","Type":"movie","Poster":"https://m.media-amazon.com/images/M/MV5BMDFlMmM4Y2QtNDg1ZS00MWVlLTlmODgtZDdhYjY5YjdhN2M0XkEyXkFqcGdeQXVyNTI4MjkwNjA@._V1_SX300.jpg"},{"Title":"South Park","Year":"1997–","imdbID":"tt0121955","Type":"series","Poster":"https://m.media-amazon.com/images/M/MV5BZjNhODYzZGItZWQ3Ny00ZjViLTkxMTUtM2EzN2RjYjU2OGZiXkEyXkFqcGdeQXVyMTI5MTc0OTIy._V1_SX300.jpg"},{"Title":"Jurassic Park III","Year":"2001","imdbID":"tt0163025","Type":"movie","Poster":"https://m.media-amazon.com/images/M/MV5BZDMyZGJjOGItYjJkZC00MDVlLWE0Y2YtZGIwMDExYWE3MGQ3XkEyXkFqcGdeQXVyNDYyMDk5MTU@._V1_SX300.jpg"},{"Title":"South Park: Bigger, Longer & Uncut","Year":"1999","imdbID":"tt0158983","Type":"movie","Poster":"https://m.media-amazon.com/images/M/MV5BOGE0ZWI0YzAtY2NkZi00YjkyLWIzYWEtNTJmMzJjODllNjdjXkEyXkFqcGdeQXVyMTQxNzMzNDI@._V1_SX300.jpg"},{"Title":"Gosford Park","Year":"2001","imdbID":"tt0280707","Type":"movie","Poster":"https://m.media-amazon.com/images/M/MV5BYzM4YzlhZGMtYTI2Yi00OTY4LWE0MzctNDFlYTQ3YmFlOTBjXkEyXkFqcGdeQXVyMTMxODk2OTU@._V1_SX300.jpg"},{"Title":"Wicker Park","Year":"2004","imdbID":"tt0324554","Type":"movie","Poster":"https://m.media-amazon.com/images/M/MV5BZDU3ZDM5MTQtNDU5NS00NDY1LWI1ODYtMzRiYjU1MTdiNWYxL2ltYWdlXkEyXkFqcGdeQXVyMTQxNzMzNDI@._V1_SX300.jpg"},{"Title":"Trailer Park Boys","Year":"2001–2018","imdbID":"tt0290988","Type":"series","Poster":"https://m.media-amazon.com/images/M/MV5BOTA0NTAwMTc1MF5BMl5BanBnXkFtZTgwODk2NjY0ODE@._V1_SX300.jpg"},{"Title":"Paranoid Park","Year":"2007","imdbID":"tt0842929","Type":"movie","Poster":"https://m.media-amazon.com/images/M/MV5BMTM4NjM1MTg2Nl5BMl5BanBnXkFtZTcwMjc2MDE2MQ@@._V1_SX300.jpg"},{"Title":"Ken Park","Year":"2002","imdbID":"tt0209077","Type":"movie","Poster":"https://m.media-amazon.com/images/M/MV5BZDU4ZTVjMmMtYmY2My00YmQxLTliODItYWVlMzFlMWYwZjg3XkEyXkFqcGdeQXVyMTQ4NDY5OTc@._V1_SX300.jpg"}],"totalResults":"1933","Response":"True"}

#4

Thank you very much for your reply

1 Like