window.location= 和 window.location.replace() 有啥区别？

Posted 2023-04-14

【中文标题】window.location= 和 window.location.replace() 有啥区别？

【英文标题】：What's the difference between window.location= and window.location.replace()?window.location= 和 window.location.replace() 有什么区别？

【发布时间】：2010-12-24 08:42:57

【问题描述】：

这两行有区别吗？

var url = "http://www.google.com/";
window.location = url;
window.location.replace(url);

【问题讨论】：

我也在这里解释过：***.com/questions/846954/…

另外，href 和 assign：***.com/q/2383401/632951，***.com/q/7703689/632951，***.com/q/10302905/632951

【参考方案1】：

window.location 将一个项目添加到您的历史记录中，您可以（或应该能够）单击“返回”并返回当前页面。

window.location.replace 替换当前历史记录项，因此您无法返回。

见window.location:

assign(url): 将文档加载到 提供的网址。

replace(url):替换当前 提供的文件 网址。与的区别 assign()方法是使用后 replace()当前页面不会 保存在会话历史中，意思是 用户将无法使用 Back 按钮导航到它。

哦，一般来说：

window.location.href = url;

被青睐：

window.location = url;

【讨论】：

为什么window.location.href 比window.location 更受青睐？

在这里讨论：***.com/questions/2383401/…

问题 - 如果我使用window.location.replace(URL)，其中 URL 与当前 URL 完全相同，我可以期望它刷新/重新加载还是可以选择什么都不做？

接受的答案是在这种情况下没有收藏夹。

@theonlygusti 例如，如果您正在使用 jest，您可以模拟位置对象，然后您可以期望调用 assign() 函数：expect(window.location.assign).toBeCalledWith('/something-here')

【参考方案2】：

TLDR;

使用location.href或更好地使用window.location.href；

但是，如果您阅读本文，您将获得无可否认的证据。

事实是它很好用，但为什么要做有问题的事情。你应该走更高的路，按照应该做的方式去做。

location = "#/mypath/otherside"
var sections = location.split('/')

这段代码在语法、逻辑、类型方面都完全正确 你知道它唯一的问题吗？

它有 location 而不是 location.href

这个呢

var mystring = location = "#/some/spa/route"

mystring 的值是多少？有没有人真的不做一些测试就知道了。没有人知道这里到底会发生什么。见鬼，我只是写了这个，我什至不知道它是做什么的。 location 是一个对象，但我正在分配一个字符串，它将传递字符串还是传递位置对象。可以说，应该如何实现它有一些答案。你能保证所有浏览器都会做同样的事情吗？

我几乎可以猜到所有浏览器都会处理相同的问题。

var mystring = location.href = "#/some/spa/route"

如果你把它放到打字稿中会不会因为类型编译器会说这是一个对象而中断？

然而，这个对话比location 对象要深入得多。这个转换是关于你想成为什么样的程序员的？

如果你走这条捷径，是的，今天可能还好，明天可能还好，地狱可能永远都好，但是先生，你现在是一个糟糕的程序员。这对你不好，它会让你失望。

会有更多的对象。会有新的语法。

你可能定义了一个只接受一个字符串但返回一个对象的 getter，最糟糕的是你会认为你做的事情是正确的，你可能认为你对这个聪明的方法很聪明，因为这里的人可耻地把你引入了歧途。

var Person.name = first:"John":last:"Doe"
console.log(Person.name) // "John Doe"

使用 getter 和 setter，这段代码实际上可以工作，但仅仅因为它可以完成并不意味着这样做是“明智的”。

大多数正在编程的人都喜欢编程并且喜欢变得更好。在过去的几年里，我变得非常好，学到了很多东西。我现在知道的最重要的事情，尤其是当您编写库时，就是一致性和可预测性。

做你能坚持做的事情。

+"2" parseInt("2")？

var num =+"2" 呢？

从你所学到的，从 *** 的角度来看，我并不抱太大希望。

如果您开始遵循一致且可预测的这两个词。您将知道 *** 上大量问题的正确答案。

让我告诉你这是如何得到回报的。 通常我将; 放在我编写的每一行javascript 上。我知道它更具表现力。我知道这更清楚。我遵守了我的规则。有一天，我决定不去。为什么？因为很多人告诉我不再需要它，而 JavaScript 可以没有它。所以我决定这样做。现在，因为我已经确定了自己作为程序员的自我（因为你应该享受掌握一门语言的果实），所以我写了一些非常简单的东西，我没有检查它。我删除了一个逗号，我认为我不需要重新测试删除一个逗号这样简单的事情。

我在 es6 和 babel 中写过类似的东西

var a = "hello world"
(async function()
  //do work
)()

这段代码失败了，花了很长时间才弄明白。 由于某种原因，它看到的是

var a = "hello world"(async function())()

隐藏在源代码的深处，它告诉我“hello world”不是一个函数。

为了更有趣，节点不显示转译代码的源图。

浪费了这么多愚蠢的时间。我也向某人展示了 ES6 是如何出色的，然后我不得不开始调试并展示 ES6 是多么的轻松和更好。没有说服力。

我希望这回答了你的问题。这是一个古老的问题，更多的是为下一代，仍在学习的人。

当人们说这两种方法都没有关系时的问题。很有可能一个更聪明、更有经验的人会告诉你其他的智慧。

如果有人覆盖了位置对象怎么办。他们将为旧浏览器做一个 shim。它将获得一些需要填充的新功能，并且您的 3 年旧代码将失败。

我要思考的最后一个笔记。

编写干净、清晰、有目的的代码可以为您的代码做一些无法用对错来回答的事情。它的作用是使您的代码成为推动者。

您可以使用更多的插件、库，而不必担心代码之间的中断。

记录在案。使用

window.location.href

【讨论】：

内容翔实的回答，热情洋溢。但是在争论使用window.location.href 而不是window.location 时，您忘记了问题实际上是询问这些和window.location.replace() 之间的区别

每当我看到 TLDR 时，我都希望得到一个更短的答案，而不是长 5 倍的答案。

TLDR; use location.href or better use window.location.href; TLDR 就是这一行。剩下的就是“答案”了。

我不认为你通过介绍不常见的用例来提出有效的观点。即mystring = location.href = "#/some/spa/route"。此外，许多语言会以某种方式允许（隐式）类型转换。归根结底，javascript 是一种动态类型语言，把类型概念放在上面说它不好是没有意义的。

如果有人覆盖了位置对象会怎样。好吧，就像说如果有人覆盖 console 或影子 window 会怎样——现在你遇到了一个更大的问题。