location.href 属性与 location.assign() 方法

Question

在使用 location.href = url 和 location.assign(url) 之间，JavaScript 内存消耗有什么特别的优势/劣势吗？

我想我想知道访问该方法是否需要更多内存而不是设置属性。

Answer 1

我个人更喜欢调用函数，因为调用函数给我的印象是某事正在运行，而不仅仅是变量的值在变化。

但可能是的，根据我的测试，location.href = url; 可能确实比location.assign(url) 快，尽管它可能取决于 JavaScript 引擎的实现。 [已删除测试的死链接。]

Answer 2

我知道这是旧的，但是当我在寻找一种方法来检查我的单元测试是否重定向到正确的 url 时，我偶然发现了这一点。

如果您更关心测试，我会选择window.location.assign()。使用函数可以模拟所述函数并检查 url 输入参数。

所以，开玩笑吧：

window.location.assign = jest.fn();

myUrlUpdateFunction();

expect(window.location.assign).toBeCalledWith('http://my.url');

// Clean up :)
window.location.assign.mockRestore();

Answer 3

我一直使用并且从未遇到过问题：

location.href = url;

调用函数应该比访问属性稍慢，但在内存方面，我的拙见应该没有太大的区别。

Answer 4

使用 location.href = url 与 location.assign(url) 相比，JavaScript 内存消耗有什么特别的优势/劣势吗？

没有

差值正好为零。

原因很简单。每次您的浏览器加载一个新页面时，它都会启动一个全新的 Javascript“VM”，其中该页面的脚本在该 VM 中运行。运行问题中的任一语句时，您正在指示浏览器加载新页面，这意味着销毁当前 VM（并释放与其关联的任何内存）并为新页面加载全新的 VM。

除了任何奇怪的浏览器错误之外，最终效果总是相同的。您的脚本在内存消耗完全相同的全新 VM 中运行。

ulocation

如果您在浏览器中使用位置对象，并且希望能够在 Node JS 上运行此代码（例如，用于测试或等距代码），您可以使用ulocation，这是一个通用/等距实现位置对象。 完全披露：我是那个包的作者。

Answer 5

在 Windows Server 2008 R2 / 7 64 位上针对 Chrome 40.0.2214.93 32 位测试我的机器/浏览器 http://jsperf.com/location-href-vs-location-assign/2

location.assign 比 location.href 慢 15%。

Answer 6

我想补充一下我在使用 React 时使用这两种方法时遇到的不同之处，但上面的答案都没有。

在 React 中分析以下 sn-p：

return (<>location.href = "www://example.com"</>)

对比

return (<>location.assign("www://example.com")</>)

在前一种情况下，您实际上会看到字符串 www://example.com 在 DOM 上输入了一瞬间，因为它会在重定向发生之前呈现文本。

为了避免这种情况我们需要使用后者location.assign()

Answer 7

其实我觉得还是有区别的

1. location.href 是一个属性，这意味着它比调用函数更快，但最重要的是 href 属性使用户能够在单击浏览器上的后退按钮时返回
2. location.replace() 用户将无法返回当前页面。
3. location.assign() 用户可以通过 href 等返回按钮返回，但 location.assign 在测试和模拟方面更好