Where does window.location.reload() get its value from?

Question

Trying reload the current page without the fragment identifier (i.e. hash symbol #) and using the following bit of code to do so which functions correctly:

var path = window.location.href.replace(/(\#.*)/,'');
window.location = path;

I'm also aware that the above second line could read window.location.href = path; which brings me to the next part.

Before arriving at the above code we tried:

var path = window.location.href.replace(/(\#.*)/,'');
window.location.href = path;
window.location.reload();

However that didn't work for us as the href value wasn't seeming to be set and I feel that reload() was calling before or instead of the href = path bit.

This got me curious, where does the reload() function for window.location get its value from to reload the page?

If I click around a page jumping between fragment identifiers (perhaps a table of contents) then the address bar updates accordingly and when called, window.location.reload() will do so with the correct fragment. Yet if I manually type something in the address bar and then call the reload() function it will not load with my manual entry but rather the last 'computer defined' value.

My guess is the user agent (in this particular case Chrome 44) is listening and updating the value which each interaction with the DOM or within the window. I checked out the HTML5 spec and the MDN Location.reload() docs for information and either it wasn't there or I'm too dense to find/understand it.

Can anyone explain to me where reload() gets it's value and how it is updated through a users interaction with a page?

What is the exact difference between using window.location = path and window.location.href = path in this scenario?

Answer 1

The location (value) only changes after a successful navigation! In other words, the location instance represents the currently loaded page (including the fragment).

Assigning a new value to window.location.href (re)loads a page.

So when you call window.location.href = path; the browser wants to load the new URL (the one without the #). But if you immediately call window.location.reload(); it's like saying "No, wait! Reload the current page (the one with the #)".