Implementing `continue;` keywords in jQuery's `each();` method

Question

Imagine that I want to loop over a list of jQuery objects, and for each of them execute some functions. However, if in some place, a criteria is not met, then I simply want to continue; to other objects. The simple pseudo-code might be something like:

$('#element').each(function(){
    // some code here
    if (!$(this).is('.included')) {
       continue; // This keyword of course, doesn't work here
    }
    // more code here, which won't get executed for some elements
});

I wan to achieve the same effect as:

for (var i = 0; i < 10; i++) {
    if (i % 2 == 0 ) {
        continue;
    }
    console.log(i);
}

I know that I can return false; somewhere inside each(); method, to completely break the looping. But I don't want to break looping. I only want to skip some elements. I also know that I can use if-else blocks to skip elements, but is there a more neat way to do this?

Returning non-false value would do it, however this is not explicitly documented - (you can guess this from $.each() docs which, hopefuly, has similar handling) — jave.web
– jave.web, Commented Oct 9, 2015 at 9:21

Molecular Man · Accepted Answer · 2011-12-10 09:23:51Z

9

simply use return; instead of continue; (not return false;).

answered Dec 10, 2011 at 9:23

Molecular Man

22.4k3 gold badges74 silver badges90 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

nnnnnn Over a year ago

Yes, unfortunately the jQuery doco doesn't point this out explicitly (though the doco for the generic iterator each() does mention it).

Mikett · Accepted Answer · 2011-12-10 19:19:45Z

When you use the .each jQuery function, you're passing a function to be executed for each value in the Array. The continue keyword is not implied in functions, but only in a direct loop. The reason jQuery breaks when you return a false value is because of this line in the jQuery libary:

if ( callback.apply( object[ name ], args ) === false ) {
  break;
}

jQuery purposely exits the loop when the executed function returns false. It would be common sense to add this, right? Since it uses === you can return anything that isn't directly equal to false, including undefined, null, 0, true, or anything. As long as it doesn't equal false, the loop will continue.

$.each([0, 1, 2, 3, 4, 5, 6, 7, 8, 9], function(i) {
  if(i > 5) { return false; } // if(i > 5) { break;    }
  if(i < 2) { return null;  } // if(i < 2) { continue; }
   console.log(i);
});

Your console would look like this:

Notice it didn't log 0 and 1. i was less than 2, so it continued without logging. Notice it didn't log 6, 7, 8, and 9. This is because when i became more than 5, it returned false.

J.G.Sebring · Accepted Answer · 2013-11-01 15:03:34Z

1

The jQuery.each docs says:

" Returning non-false is the same as a continue statement in a for loop; it will skip immediately to the next iteration. "

I usually do return 'continue'; which is both readable and more self-explanatory than simple return;, return true; or return 1;

I've also encountered return 'non-false'; which is quite funny in a geeky way.

answered Nov 1, 2013 at 15:03

J.G.Sebring

5,9541 gold badge33 silver badges42 bronze badges

Comments

FK82 · Accepted Answer · 2011-12-10 16:24:03Z

0

I don't really see the need for the continue statement:

$('#element').each(function(){
    // some code here
    if( $(this).is('.included') ) {
        // more code here, which won't get executed for some elements
    }
});

This ought to do exactly the same, unless I'm missing something.

answered Dec 10, 2011 at 16:24

FK82

5,0754 gold badges34 silver badges44 bronze badges

Collectives™ on Stack Overflow

Implementing `continue;` keywords in jQuery's `each();` method

4 Answers 4

1 Comment

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

1 Comment

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related