javascript - 为什么要缓存 jQuery 对象？

Question

那么我们为什么要缓存 jQuery 对象呢？

在以下场景中:

var foo = $('#bar');
foo.attr('style','cool');
foo.attr('width','123');

$('#bar').attr('style','cool');
$('#bar').attr('宽度','123');

为什么第一个选项比第二个选项好这么多？

如果是因为性能，它如何减少使用量？

Answer 1

因为 jQuery 函数中有很多代码，如果您使用相同的输入期望相同的输出多次执行它，就会涉及不必要的开销。通过缓存结果，您可以存储对要查找的确切元素或元素集的引用，这样您就不必再次搜索整个 DOM(即使搜索速度相当快)。在许多情况下(具有少量代码的简单页面)您不会注意到差异，但在您注意到的情况下可能会产生很大的差异。

您可以通过 testing your example in jsPerf 查看实际效果.

您也可以将其视为 Introduce Explaining Variable 的示例出于可读性目的重构模式，特别是对于比问题中的示例更复杂的示例。