突然有点想不起Jq的each()回调函数里,
return true
和return false
的行为表现了。所以写下demo记录下。
1. 结论
在each(function(){})
中:
return true
(return
) 相当于continue,跳出当次循环;
return false
相当于 break,跳出当前循环。
2. 案例验证
代码语言:javascript复制<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<script type="text/javascript" src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<script type="text/javascript">
var testData = [
{
"id":1,
"name":"aa",
"age": 8
},
{
"id":2,
"name":"bb",
"age": 12
},
{
"id":3,
"name":"cc",
"age": 18
},
{
"id":5,
"name":"ee",
"age": 1
},
{
"id":4,
"name":"dd",
"age": 22
},
]
$(testData).each(function(){
if (this.age >= 18) return true;
console.log(this); // 返回 年龄 8/12/1
});
$(testData).each(function(){
if (this.age >= 18) return false;
console.log(this);// 返回 年龄 8/12
});
</script>
</body>
</html>
由于参考文章都提及需要通过try-catch
来跳出函数,于是我又尝试each遍历标签jq对象,结果发现上面的结论是ok的。
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<div>8</div>
<div>12</div>
<div>18</div>
<div>1</div>
<div>22</div>
<script type="text/javascript" src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<script type="text/javascript">
$('div').each(function(){
if (Number($(this).text()) >= 18) return true;
console.log('test-for-return-true: ',$(this).text()); // 返回 8/12/1
});
$('div').each(function(){
if (Number($(this).text()) >= 18) return false;
console.log('test-for-return-false: ',$(this).text());// 返回 8/12
});
</script>
</body>
</html>
参考文章:
- jquery中each函数的return
- Jquery的each里面用return false代替break; return ture 代替continue
两篇文章都提到了:、
return true
(return
) 相当于continue,跳出当次循环;return false
相当于 break,跳出当前循环。 但又都提到需要用try-catch来跳出函数。有点奇怪,个人测试return false;
在满足条件的时候就会跳出each循环。