Why you should care

Remediating this code pattern can take back up to 50% of the time consumed by a function.

Since object members may contain other members, it’s not uncommon to see patterns such as window.location.href in JavaScript code. These nested members cause the JavaScript engine to go through the object member resolution process each time a dot is encountered, while storing properties in local variables will dramatically increase execution speed in some cases.

Business Impacts

CAST Recommendations

Generally speaking, if you’re going to read an object property more than one time in a function, it’s best to store that property value in a local variable. The local variable can then be used in place of the property to avoid the performance overhead of another property lookup. This is especially important when dealing with nested object members that have a more dramatic effect on execution speed.

Bad pattern:
function toggle(element){
if (YAHOO.util.Dom.hasClass(
element, “selected”)){
YAHOO.util.Dom.removeClass(
element, “selected”);
return false;
} else {
YAHOO.util.Dom.addClass(
element, “selected”);
return true;
}
}

Good pattern:
function toggle(element) {
var Dom = YAHOO.util.Dom;
if (Dom.hasClass(element, “selected”)){
Dom.removeClass(element, “selected”);
return false;
} else {
Dom.addClass(element, “selected”);
return true;
}
}

References

https://www.w3.org/wiki/JavaScript_best_practices#Keep_DOM_access_to_a_minimum