2

具体来说,是这段代码:

var style = el.style;
var x = style.left;
var y = style.top;

比这个更有效:

var x = el.style.left;
var y = el.style.top;

我最近和一位同事讨论过这个问题。第一个片段保存了一个 getter 调用,因为它缓存了样式对象,但它创建了一个对样式对象的引用并使用了一个变量。

4

3 回答 3

0

这没什么大不了的。

刚刚在jsperf上给你写了个测试看看……并驾齐驱,几乎没有区别(在我的机器上没有统计学上的显着差异):

http://jsperf.com/alias-vs-dot-lookup-speed

干杯。

于 2013-01-06T03:01:21.083 回答
0

这个答案取决于你真正关心的问题:

  1. 如果性能是您主要关心的问题,那么您必须在所有重要的浏览器中测量这两种情况并评估这些测量的结果。
  2. 如果您只是在寻找一个好的经验法则来遵循,那么我认为只为这样的两种用途创建一个新变量可能不值得,除非它是一个高性能敏感的代码片段,在这种情况下规则# 1胜。
  3. 如果您正在寻找代码简单性、紧凑性和速度之间的良好平衡,那么我会说要避免这种简单情况下的额外变量和额外的代码行。性能差异不会很大,所以为什么要增加复杂性和更多代码。
  4. 如果您正在寻找正确性问题,那么这完全是个人意见,双方都可以争论。我会争辩#3获胜。当没有其他因素驱动您的决定时,请尽量简单。
于 2013-01-06T03:04:01.510 回答
0

我会将其归类为过早优化,除非您遇到某种性能问题,否则我不会担心您在此处采用哪种方法(尤其是对于像这样小的代码)。如果样式属性已经在内部被 DOM 缓存,我不会感到惊讶,因此每次访问它时甚至可能不会有任何额外的开销。

是否建议缓存仅在 JavaScript 中使用两次的对象

回答您的问题 - 如果在访问它时有很多开销,那么通常缓存是一个好主意,例如,它可能是在每次访问时创建的,或者导致对集合进行昂贵的查找。但是,如果它纯粹直接返回对象,那么我看不到任何好处。

如果您在获得精确答案之后,那么获得答案的唯一方法就是对两个版本进行实际基准测试。但是,对于您的特定代码,我会说任何性能差异都可以忽略不计。但是,引入另一个变量为编译器增加不必要的开销(尽管很小)。

于 2013-01-06T03:04:27.700 回答