在前端开发中，我们经常需要更改当前页面的 URL。而 JavaScript 提供了三种修改 URL 的方法：window.location.href、window.location.replace 和 window.location.assign。虽然它们看起来很相似，但它们在实际使用中有一些重要的区别。
window.location.href
window.location.href 是最常见的修改页面 URL 的方法。它可以用于加载一个新的页面或者在当前页面刷新。当你把一个新的 URL 赋值给 window.location.href 时，浏览器会立即开始加载这个新的 URL，并且在加载完成后将其显示出来。
// 加载一个新的页面 window.location.href = "https://www.example.com"; // 刷新当前页面 window.location.href = window.location.href;
window.location.replace
window.location.replace 方法也可以用于加载一个新的页面，与 window.location.href 不同的是，它不会在浏览器历史记录中留下任何记录。这意味着用户无法通过后退按钮返回到原来的页面，而是直接跳转到上一个页面。
// 使用 replace 方法加载一个新的页面
window.location.replace("https://www.example.com");window.location.assign
window.location.assign 方法与 window.location.href 类似，也可以用于加载一个新的页面或者在当前页面刷新。与 window.location.href 不同的是，window.location.assign 方法将新的 URL 添加到浏览器历史记录中，这意味着用户可以通过后退按钮返回到原来的页面。
// 加载一个新的页面
window.location.assign("https://www.example.com");
// 刷新当前页面
window.location.assign(window.location.href);区别和注意事项
在实际使用中，我们需要根据具体的需求选择适合的方法。下面是三种方法的区别和注意事项：
window.location.href可以用于加载一个新的页面或者在当前页面刷新，但是会在浏览器历史记录中留下记录。window.location.replace也可以用于加载一个新的页面，但是不会在浏览器历史记录中留下记录，所以用户无法通过后退按钮返回到原来的页面。window.location.assign类似于window.location.href，可以用于加载一个新的页面或者在当前页面刷新，但是会在浏览器历史记录中留下记录。
在使用这些方法时，还需要注意一些细节：
- 尽管
window.location.replace不会在浏览器历史记录中留下记录，但是它仍然会对浏览器历史记录造成影响。例如，如果用户在一个使用了window.location.replace的页面中打开了一个新的页面，那么这个新的页面将成为浏览器历史记录中的前一个页面，而不是使用window.location.replace的页面。 - 使用
window.location.assign加载一个新的页面时，如果新的页面与原来的页面位于同一个域名下，那么浏览器会重复利用已经存在的连接，这会提高网页的加载速度。
总结
在本文中，我们介绍了三种修改页面 URL 的方法：window.location.href、window.location.replace 和 window.location.assign。它们在实际使用中有一些重要的区别和注意事项，需要根据具体的需求选择适合的方法。希望本文能够帮助你更好地理解这些方法的区别和使用方法。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/11976