Window Fetch Method: Analysis with respect to JavaScript | Angular | React

Hope you all doing good :) . Lets begin with understanding the Fetch method in accord with JavaScript, Angular and ReactJS.

JavaScript : Before ES6 comes out, the only way to make an http call in JavaScript was 'XMLHttpRequest' which is a built-in browser object that allows us to make http request asynchronously.

Here is an example-

Between let us understand what is XMLHttpRequest and HttpRequest. XMLHttpRequest - Standard JavaScript object allows us to do http request from the browser in JavaScript. HttpRequest - Server side object that represents request to the server. Both represents the outgoing requests where one works in browser and other in the server.

Fetch methods is used to request to the server and load information in the webpages and it is the replacement of the Ajax based XMLHttpRequest.

Here is an example replacing the XMLHttpRequest Object with Fetch method

Angular 2 and above : Can we use the fetch method in Angular for Http request ? Yes, nothing wrong in using it. Angular provides the injectable HttpClient is richer in which you can specify the datatype/model for your result and returns the Observable which are more feature rich than the promises.

React JS: It is the similar way how you use it in JavaScript using Fetch Method.

Happy Coding :)