5411 posts The Dude Abides
  • Located in United States
  • Elite Author: Sold more than $75,000 on Envato Market
  • Has sold $125,000+ on Envato Market
  • Has been part of the Envato Community for over 5 years
+9 more
CodingJack says

When it comes to something like this in jQuery:

element.each(function() { // do something });

... and there are 5 elements, do five objects get created in memory for the function part? And if so, shouldn’t we always be doing this instead?

element.each(unestedFunction);

function unestedFunction() { // do something }
6144 posts
  • Sells items exclusively on Envato Market
  • Elite Author: Sold more than $75,000 on Envato Market
  • Has sold $125,000+ on Envato Market
  • Has been part of the Envato Community for over 6 years
+8 more
VF says

Yes, especially when the function does too many things, better avoid creating it many times.

Looks like this is considered on codecanyon to approve scripts. However there is no much discussions on this subject on jQuery communities.

5411 posts The Dude Abides
  • Located in United States
  • Elite Author: Sold more than $75,000 on Envato Market
  • Has sold $125,000+ on Envato Market
  • Has been part of the Envato Community for over 5 years
+9 more
CodingJack says

Cool. Yeah I sort of knew the answer but was curious why I never see this practiced. But regardless of whether its required for review or not, I don’t see any reason why someone would ever need to nest the function in this situation. Same goes for adding events. But the more we push the envelope with JS, the more we need to optimize.

5411 posts The Dude Abides
  • Located in United States
  • Elite Author: Sold more than $75,000 on Envato Market
  • Has sold $125,000+ on Envato Market
  • Has been part of the Envato Community for over 5 years
+9 more
CodingJack says

Just thought, maybe the need to pass an increment argument like this:

element.each(function(i) { // do somethig with "i" });

would be the only reason why a nested function using .each would be useful.

Personally I’ve always nested when using .each but won’t be doing so anymore after giving it more thought.

5411 posts The Dude Abides
  • Located in United States
  • Elite Author: Sold more than $75,000 on Envato Market
  • Has sold $125,000+ on Envato Market
  • Has been part of the Envato Community for over 5 years
+9 more
CodingJack says

^ scratch that “i” example. It still iterates un-nested.

6144 posts
  • Sells items exclusively on Envato Market
  • Elite Author: Sold more than $75,000 on Envato Market
  • Has sold $125,000+ on Envato Market
  • Has been part of the Envato Community for over 6 years
+8 more
VF says

Yes, the only benefit I see is variable scope. Some rare cases may be beneficial with nesting due to complexity to go with function declaration.

I guess some of the unoptimized practices lives just due to popularity and by beginners. When I first time started using jQuery (also a javascript noob) I didn’t felt doing something wrong whenever I just adopted practices like above. Later understood from reviewer’s advice on soft rejection and then started digging about function recreations.

5411 posts The Dude Abides
  • Located in United States
  • Elite Author: Sold more than $75,000 on Envato Market
  • Has sold $125,000+ on Envato Market
  • Has been part of the Envato Community for over 5 years
+9 more
CodingJack says

I guess some of the unoptimized practices lives just due to popularity and by beginners.

Yeah maybe jQuery was built for designers more than coders. And designers by nature wouldn’t necessarily notice the same things developers would resulting in widespread bad practices. So kudos to reviewers trying to steer us in the right direction.


When I first time started using jQuery (also a javascript noob) I didn’t felt doing something wrong whenever I just adopted practices like above.

I’m in the same boat. I feel like I learned jQuery before JavaScript, and still feel like I have a lot of things to still learn with regards to JS.

42 posts
  • Has been part of the Envato Community for over 4 years
  • Has sold $10,000+ on Envato Market
  • Has collected 1+ items on Envato Market
  • Sells items exclusively on Envato Market
maguiar01 says

When it comes to something like this in jQuery:
element.each(function() { // do something });

... and there are 5 elements, do five objects get created in memory for the function part? And if so, shouldn’t we always be doing this instead?

element.each(unestedFunction);

function unestedFunction() { // do something }
Hi CodingJack

I don’t think i understand it, what exactly do you mean by “five objects get created in memory for the function part?”. You’re asking if will be created 5 copies of the function code in the memory?

5411 posts The Dude Abides
  • Located in United States
  • Elite Author: Sold more than $75,000 on Envato Market
  • Has sold $125,000+ on Envato Market
  • Has been part of the Envato Community for over 5 years
+9 more
CodingJack says

Yes, the only benefit I see is variable scope.

Just going through some code and found an example of this:

for(var i = 0; i < maxSubs; i++) {

    ul = ul.children("li").children("ul").each(function() {

        st = i % 2 === 0 ? "light" : "dark";

        $(this).addClass(st + "-sub").prepend($("<div />").addClass("nav-arrow " + st + "-arrow"));

    });

}

(forget about the context, but notice the for-loop’s “i” being used inside the .each)

5411 posts The Dude Abides
  • Located in United States
  • Elite Author: Sold more than $75,000 on Envato Market
  • Has sold $125,000+ on Envato Market
  • Has been part of the Envato Community for over 5 years
+9 more
CodingJack says

You’re asking if will be created 5 copies of the function code in the memory?

yes :)

Helpful Information

  • Please read our community guidelines. Self promotion and discussion of piracy is not allowed.
  • Open a support ticket if you would like specific help with your account, deposits or purchases.
  • Item Support by authors is optional and may vary. Please see the Support tab on each item page.

Most of all, enjoy your time here. Thank you for being a valued Envato community member.

Post Reply

Format your entry with some basic HTML. Read the Full Details, or here is a refresher:

<strong></strong> to make things bold
<em></em> to emphasize
<ul><li> or <ol><li> to make lists
<h3> or <h4> to make headings
<pre></pre> for code blocks
<code></code> for a few words of code
<a></a> for links
<img> to paste in an image (it'll need to be hosted somewhere else though)
<blockquote></blockquote> to quote somebody

:grin: :shocked: :cry: Complete List of Smiley Codes

by
by
by
by
by
by