JQuery each - Stop loop and return object

Question

Can anyone tell me why the loop didn't stop after recording 5 ?

http://jsbin.com/ucuqot/edit#preview

---

 $(document).ready(function() { someArray = new Array(); someArray[0] = 't5'; someArray[1] = 'z12'; someArray[2] = 'b88'; someArray[3] = 's55'; someArray[4] = 'e51'; someArray[5] = 'o322'; someArray[6] = 'i22'; someArray[7] = 'k954'; var test = findXX('o322'); }); function findXX(word) { $.each(someArray, function(i) { $('body').append('-> '+i+'<br />'); if(someArray[i] == 'someArray') { return someArray[i]; //<--- did not stop the loop! } }); } 

Answer 1

Because when you use the return inside each loop, a non-false value will act like continue , while false will act like break . You will need to return false from each function. Something like that:

 function findXX(word) { var toReturn; $.each(someArray, function(i) { $('body').append('-> '+i+'<br />'); if(someArray[i] == word) { toReturn = someArray[i]; return false; } }); return toReturn; } 

From the docs :

We can break the $ .each () loop at a specific iteration, forcing the callback function to return false. The non-false return is the same as the continue statement in a for loop; he will immediately proceed to the next iteration.

Answer 2

here:

http://jsbin.com/ucuqot/3/edit

 function findXX(word) { $.each(someArray, function(i,n) { $('body').append('-> '+i+'<br />'); if(n == word) { return false; } }); } 

Answer 3

modified $.each function

 $.fn.eachReturn = function(arr, callback) { var result = null; $.each(arr, function(index, value){ var test = callback(index, value); if (test) { result = test; return false; } }); return result ; } 

it will interrupt the cycle to a non-false / non-empty result and return it back, so in your case it will be

 return $.eachReturn(someArray, function(i){ ... 

Answer 4

Try it...

  someArray = new Array(); someArray[0] = 't5'; someArray[1] = 'z12'; someArray[2] = 'b88'; someArray[3] = 's55'; someArray[4] = 'e51'; someArray[5] = 'o322'; someArray[6] = 'i22'; someArray[7] = 'k954'; var test = findXX('o322'); console.log(test); function findXX(word) { for(var i in someArray){ if(someArray[i] == word) { return someArray[i]; //<--- stop the loop! } } } 

Answer 5

"We can break the $ .each () loop at a specific iteration by making the callback function return false. The non-false return is the same as the continue statement in the for loop; it will skip right away until the next iteration."

from http://api.jquery.com/jquery.each/

Yes, this is old, BUT, SIMPLY, to answer the question, it can be a little easier:

 function findXX(word) { $.each(someArray, function(index, value) { $('body').append('-> ' + index + ":" + value + '<br />'); return !(value == word); }); } $(function() { someArray = new Array(); someArray[0] = 't5'; someArray[1] = 'z12'; someArray[2] = 'b88'; someArray[3] = 's55'; someArray[4] = 'e51'; someArray[5] = 'o322'; someArray[6] = 'i22'; someArray[7] = 'k954'; findXX('o322'); }); 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 

A little more with comments:

 function findXX(myA, word) { let br = '<br />';//create once let myHolder = $("<div />");//get a holder to not hit DOM a lot let found = false;//default return $.each(myA, function(index, value) { found = (value == word); myHolder.append('-> ' + index + ":" + value + br); return !found; }); $('body').append(myHolder.html());// hit DOM once return found; } $(function() { // no horrid global array, easier array setup; let someArray = ['t5', 'z12', 'b88', 's55', 'e51', 'o322', 'i22', 'k954']; // pass the array and the value we want to find, return back a value let test = findXX(someArray, 'o322'); $('body').append("<div>Found:" + test + "</div>"); }); 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 

NOTE: the .includes() array may be better suited here https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/includes

Or just .find() to get this https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/find