Jquery each - Arrêter la boucle et retourner l'objet

Question

Quelqu'un peut-il me dire pourquoi la boucle ne s'est pas arrêtée après la 5 entrée ?

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

Parce que lorsque vous utilisez un return à l'intérieur d'un each une valeur " non fausse " agira comme une continue alors que false agira comme un break . Vous devrez retourner false de la each fonction. Quelque chose comme ça :

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

De la docs :

Nous pouvons interrompre la boucle $.each() à une itération particulière en faisant de la fonction en faisant en sorte que la fonction de rappel renvoie false. Le fait de renvoyer non-faux est identique à l'instruction continue dans une boucle for ; elle passe immédiatement à l'itération suivante. prochaine itération.

Answer 2

Modifié $.each fonction

$.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 ;
}

il interrompra la boucle sur un résultat non faux/non vide et le renverra, donc dans votre cas ce serait

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

Answer 3

Ici :

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

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

Answer 4

Essayez ceci...

  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

"Nous pouvons interrompre la boucle $.each() à une itération particulière en faisant en sorte que en faisant en sorte que la fonction de rappel renvoie false. Renvoyer non-faux est la même chose que l'instruction continue dans une boucle for ; elle passe immédiatement à l'itération suivante. l'itération suivante."

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

Oui, c'est vieux mais, pour répondre à la question, cela peut être un peu plus simple :

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>

Un peu plus avec des commentaires :

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 : le tableau .includes() peut mieux convenir ici https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/includes

Ou juste .find() pour obtenir ce https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/find