Question

在这里给出一些像这样的JS代码：

  for (var i = 0; i < document.getElementsByName('scale_select').length; i++) {
    document.getElementsByName('scale_select')[i].onclick = vSetScale;
  }

如果我们在循环之前将getElementsByName的结果放入变量然后在那之后使用变量，代码会更快吗？

我不确定这种效果在现实生活中有多大，getElementsByName的结果通常具有＆lt; 10项。无论如何，我想了解潜在的机制。

另外，如果这两个选项还有其他值得注意的地方，请告诉我。

Answer 1

当然。存储所需的内存只是指向DOM对象的指针，并且显着比每次需要使用某些东西时进行DOM搜索时更少痛苦！

理想代码：

var scale_select = document.getElementsByName('scale_select');
for (var i = 0; i < scale_select.length; i++)
    scale_select[i].onclick = vSetScale;

Answer 2

缓存属性查找可能有所帮助，但c aching the length of the array before starting the loop has proven to be faster.

因此在循环中声明一个包含scale_select.length值的变量会加快整个循环的速度。

var scale_select = document.getElementsByName('scale_select');
for (var i = 0, al=scale_select.length; i < al; i++)
    scale_select[i].onclick = vSetScale;

Answer 3

DOM的智能实现将执行自己的缓存，在某些更改时使缓存无效。但是今天并不是所有的DOM都能被认为是聪明的（咳嗽 IE 咳嗽）所以最好自己这样做。

Answer 4

原则上，如果我们在循环之前将getElementsByName的结果放入变量然后在之后使用变量，代码会更快吗？

是

Answer 5

使用变量。它们在JavaScript中并不是非常昂贵，函数调用肯定更慢。如果在document.getElementById（）上至少循环5次，请使用变量。这里的想法不仅是函数调用很慢，而且这个特定的函数非常慢，因为它试图在DOM中找到具有给定id的元素。

Answer 6

@ Oli

缓存在变量中获取的元素的length属性也是一个好主意：

var scaleSelect = document.getElementsByName('scale_select');
var scaleSelectLength = scaleSelect.length;

for (var i = 0; i < scaleSelectLength; i += 1)
{
    // scaleSelect[i]
}

Answer 7

没有必要将scaleSelect.length存储在单独的变量中;它实际上已经在一个中 - scaleSelect.length只是scaleSelect数组的一个属性，因此它可以像任何其他静态变量一样快速访问。

Answer 8

我是这么认为的。每次循环时，引擎都需要重新评估document.getElementsByName语句。

另一方面，如果该值保存在变量中，那么它已经具有该值。

JS函数调用有多贵（与为变量分配内存相比）？

8 个答案: