The fetch() method in JavaScript is used to get the data from the server displayed on the screen in the form of web pages. APIs make the request, and data is returned in JSON or XML format. Finally, the fetch() method returns a promise.
Syntax
fetch(url, {options})
.then(data => {
// Do some stuff here
})
.catch(err => {
// Catch and display errors
})
Arguments
The fetch() method contains two parameters, of which one is an optional parameter.
URL: This is the place where we need to write the URL of the JSON file for which we need to make a request. Basically, this is the actual path of the resource that we want to fetch.
Optional: It’s an optional parameter, an array of properties.
Return value
The fetch get() method returns a promise whether the request is resolved or not. It can return data in either JSON format or XML format.
How to Use fetch get in JavaScript
To use fetch get in JavaScript, use the fetch() function and pass the endpoint URL that returns the data; use the .json() method to convert the JSON object to JavaScript Object.
The fetch API returns a promise. Because of this, you need to nest a then() method to handle the resolution. To demonstrate fetch get request, we will use the free API: https://tenders.guru/api/es/tenders
import fetch from "node-fetch"
fetch('https://tenders.guru/api/es/tenders')
.then(data => {
return data.json();
})
.then(post => {
console.log(post.data[0].title);
});
Output
Servicio de producción de células mesenquimales troncales adultas autólogas y alogénicas de
medula ósea expandidas, vinculado al proyecto de investigación PIC18/00001
The data returned from the API is not usually in a useable form. So you’ll need to convert the data to a form that your JavaScript can operate with. Thankfully, you can use the .json() method to do just that:
As you can see in the above code, you can nest a subsequent then() method to parse the data.
Fetch API GET Request
Title | Completed? |
delectus aut autem | false |
quis ut nam facilis et officia qui | false |
fugiat veniam minus | false |
et porro tempora | true |
laboriosam mollitia et enim quasi adipisci quia provident illum | false |
qui ullam ratione quibusdam voluptatem quia omnis | false |
illo expedita consequatur quia in | false |
quo adipisci enim quam ut ab | true |
molestiae perspiciatis ipsa | false |
illo est ratione doloremque quia maiores aut | true |
Explanation
In this example, we have used fetch() API. As we discussed, the fetch() method takes a mandatory parameter which is a resource URL that needs to be fetched.
So we have given a link here that has only one JSON object. After that, we are creating a response i.e a JSON response. Finally, we are printing the fetched object using the console.log() function.
Conclusion
The fetch() is a tool that lets you make simple AJAX (Asynchronous JavaScript and XML) calls with JavaScript.
That’s it for this tutorial.
See also
How to Use Export Default in JavaScript
How to Write a File in JavaScript
How to Read a JSON file in JavaScript

Krunal Lathiya is a Software Engineer with over eight years of experience. He has developed a strong foundation in computer science principles and a passion for problem-solving. Krunal has experience with various programming languages and technologies, including PHP, Python, and expert in JavaScript. He is comfortable working in front-end and back-end development.