Jquery each-Stop 循环并返回对象

谁能告诉我为什么循环在 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!
}
});
}
123924 次浏览

这里:

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

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

因为当您在 each循环中使用 return语句时,“ non-false”值将充当 continue,而 false将充当 break。您需要从 each函数返回 false。就像这样:

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

来自 医生:

我们可以在特定的迭代中破坏 $. each ()循环,方法是使 回调函数返回 false。返回 non-false 与返回 继续语句; 它将立即跳到下一个 迭代。

试试这个..。

  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!
}
}
}

修改后的 $.each函数

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

它将在非 false/非空结果上中断循环并返回它,因此在您的示例中,它将是

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

”我们可以在特定的迭代中破坏 $. each ()循环 回调函数返回 false。返回 non-false 与 在 for 循环中使用的一个 keep 语句; 它将立即跳到 下一个版本”

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

是的,这是旧的,但是,只是为了回答这个问题,这可以更简单一点:

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 bit 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: array .includes() may better suit here https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/includes

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

与设置标志不同,使用 JavaScript 的 Array.prototype.find在数组中查找匹配项可能更优雅。循环将在从回调函数返回一个 true 值时结束,并且在该迭代期间的数组值将是 .find调用的返回值:

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

const 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('found word:', test);


function findXX(word) {
return someArray.find((item, i) => {
$('body').append('-> ' + i + '<br />');
return item === word;
});
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>