DISCLAMER:
This series simplifies how stuff work to give you an idea of what to expect but this is not the actual code and I will include the actual docs of the steps of how stuff work with each part of this series for the super nerds out there.
If you want to know more about something or how it actually works write a comment and I might just do it.
what is the fetch method?
The global fetch() method starts the process of fetching a resource from the network, returning a promise which is fulfilled once the response is available.
How it works:
first of all we need to dissect the fetch method to understand it
we know that it takes an API string URL as a parameter
and returns a Promise
so let us implement that
function fetch2(API)
return new Promise(resolve => {
});
Yaaay we did it!
not that fast we now need to know what happens to the API string
the fetch transforms the URL with the options if any to a Request object
You can actually pass a Request object directly.
and after that the fetch runs the Request and receives a Promise that gets resolved to a Response Object
And this is how it resolves the promise.
Remember the fetch2 function up there let us continue the implementation
function fetch2(API)
const Response = someMagicalService(Request(API))
return new Promise(resolve => {
const interval = setInterval(() =>{
if(Response.status){
clearInterval(interval);
resolve(Response);
}
}, 100)
});
the fetch keeps checking the status of the response and when a status comes the interval "Response checking" stops and the promise is resolved.
the someMagicalService part can be broken apart to multiple lines but for simplicity I just called it that
Do not forget to comment with any topic that you want to know about in some detail - as long as it is related to (JS, ReactJS) -
And leave a Heart & follow if you want to read more articles like this
References:
Fetch
Top comments (0)