2

Possible Duplicate:
What is the cost of '$(this)'?

In terms of both performance and readability is it good practice to name variables instead of using $(this)?

An example would be

$(".element").click(function() {

    var elem = $(this);

    //Examples
    elem.addClass("example");
    console.log( elem.attr("id") );

}):
Community
  • 1
  • 1
Undefined
  • 11,234
  • 5
  • 37
  • 62
  • @VisioN I did not see that question whilst searching, I would be fine with voluntary deletion if people agree. – Undefined Jul 19 '12 at 08:38
  • I use `_this=$(this);` rather `elem=$(this);`, I feel easy to write code in that way. – Riz Jul 19 '12 at 08:42
  • Use `$this = $(this);` or `$elem = ...` instead of `elem`. Code becomes more readable when you're consistently prefixing jQuery-objects with `$`. – Rob W Jul 19 '12 at 08:46
  • http://www.artzstudio.com/2009/04/jquery-performance-rules/ – NimChimpsky Jul 19 '12 at 08:46

2 Answers2

0

Yes it is. Since $(this) essentially is a pretty expensive function call triggering a Dom-Search you repeat it everytime you call $(this) while with var elem = $(this); you have the function-call once and store the result in a variable.

Actually it's much more expensive when passing selectors to the function than passing an DOM-Element like this. So caching this will have a very tiny effect only, while caching something like $("#foo[name|='bar']") will really matter.

I prefer prepending the $ to the variable name so that it's obvious that you have a jQery Object here. 

$this = $(this);

Now $this has no significant drawback from the point of readability while having the performance advantage. Also it can be minified by compressors to a single letter variable, while $(this) can't.

Christoph
  • 50,121
  • 21
  • 99
  • 128
  • I think, there will be no noticeable difference. – Riz Jul 19 '12 at 08:38
  • @Dev It's less noticable for actual DOM_Elements and very noticable for selectors. – Christoph Jul 19 '12 at 08:39
  • 1
    That's for performance. For readability, I think it depends on the context: when you're doing two unrelated things to $(this), I think it's more readable to specify $(this) each time - but when it's more relevant that all of the things are done to the same element, the variable makes more conceptual sense. – Brilliand Jul 19 '12 at 08:39
  • @Brilliand I normally use `$` for cached jQuery Objects, so `$this` is pretty obvious I think. – Christoph Jul 19 '12 at 08:43
  • @Christoph - That makes sense. The extra line of code might still cost some readability, though (which I hadn't thought of when I made my previous comment). – Brilliand Jul 19 '12 at 10:24
  • well, per se you don't need a new line, as you could write `$this = $(this).doStuff().doMoreStuff()` since the returnvalue of any jQuery function always is the object itself. (Except selector functions of course, which may alter the resultset) – Christoph Jul 19 '12 at 11:33
0

I would personally prefer to cache the reference to variable that remain unchanged, no matter how efficient the search in jQuery is implemented. Anyhow referring variable is faster.

skovalyov
  • 2,069
  • 1
  • 16
  • 12