详解JavaScript中循环控制语句的用法


Posted in Javascript onJune 03, 2015

 JavaScript提供完全控制来处理循环和switch语句。可能有一种情况,当你需要退出一个循环,但未达到其底部。也可能有一种情况,当要跳过的码块的一部分,并直接开始下一个迭代。

为了处理这些情况下,JavaScript提供了break和continue语句。这些语句是用来马上退出任何循环或启动循环的下一次迭代。
break 语句:

break语句,这是简单地用switch语句介绍,用于提前退出循环,打破封闭的花括号。
例子:

这个例子说明了如何使用break语句同while循环。请注意循环打破了初期由x到5,document.write(..) 语句的正下方,以右大括号:

<script type="text/javascript">
<!--
var x = 1;
document.write("Entering the loop<br /> ");
while (x < 20)
{
 if (x == 5){ 
   break; // breaks out of loop completely
 }
 x = x + 1;
 document.write( x + "<br />");
}
document.write("Exiting the loop!<br /> ");
//-->
</script>

这将产生以下结果:

Entering the loop
2
3
4
5
Exiting the loop!

我们已经看到break语句在switch语句中使用。
continue 语句:

continue语句告诉解释器立即启动循环的下一次迭代,并跳过其余的代码块。

当遇到continue语句,程序流程将立即转移到循环检查表达式,如果条件保持真,那么就开始下一个迭代,否则控制退出循环。
例子:

这个例子说明使用continue语句同while循环。请注意continue语句用于跳过打印时指数变量x到达5:

<script type="text/javascript">
<!--
var x = 1;
document.write("Entering the loop<br /> ");
while (x < 10)
{
 x = x + 1;
 if (x == 5){ 
   continue; // skill rest of the loop body
 }
 document.write( x + "<br />");
}
document.write("Exiting the loop!<br /> ");
//-->
</script>

这将产生以下结果:

Entering the loop
2
3
4
6
7
8
9
10
Exiting the loop!

 
使用标签来控制流程:

从JavaScript1.2开始,标签可以与break及continue使用,继续更精确地控制流程。

标签是简单的标识符随后被施加到一个语句或代码块冒号。看到两个不同的例子来了解标签使用突破,并继续。

注:换行符是不是继续还是分手声明,其标签名称之间允许的。此外,不应该有一个标签名称和相关联的回路之间的任何其它声明。
实例1:

<script type="text/javascript">
<!--
document.write("Entering the loop!<br /> ");
outerloop:  // This is the label name
for (var i = 0; i < 5; i++)
{
 document.write("Outerloop: " + i + "<br />");
 innerloop:
 for (var j = 0; j < 5; j++)
 {
   if (j > 3 ) break ;     // Quit the innermost loop
   if (i == 2) break innerloop; // Do the same thing
   if (i == 4) break outerloop; // Quit the outer loop
   document.write("Innerloop: " + j + " <br />");
  }
}
document.write("Exiting the loop!<br /> ");
//-->
</script>

这将产生以下结果:

Entering the loop!
Outerloop: 0
Innerloop: 0 
Innerloop: 1 
Innerloop: 2 
Innerloop: 3 
Outerloop: 1
Innerloop: 0 
Innerloop: 1 
Innerloop: 2 
Innerloop: 3 
Outerloop: 2
Outerloop: 3
Innerloop: 0 
Innerloop: 1 
Innerloop: 2 
Innerloop: 3 
Outerloop: 4
Exiting the loop!

 
实例2:

<script type="text/javascript">
<!--
document.write("Entering the loop!<br /> ");
outerloop:  // This is the label name
for (var i = 0; i < 3; i++)
{
  document.write("Outerloop: " + i + "<br />");
  for (var j = 0; j < 5; j++)
  {
   if (j == 3){
     continue outerloop;
   }
   document.write("Innerloop: " + j + "<br />");
  } 
}
document.write("Exiting the loop!<br /> ");
//-->
</script>

这将产生以下结果:

Entering the loop!
Outerloop: 0
Innerloop: 0
Innerloop: 1
Innerloop: 2
Outerloop: 1
Innerloop: 0
Innerloop: 1
Innerloop: 2
Outerloop: 2
Innerloop: 0
Innerloop: 1
Innerloop: 2
Exiting the loop!
Javascript 相关文章推荐
Mootools 1.2教程 Fx.Morph、Fx选项和Fx事件
Sep 15 Javascript
dess中一个简单的多路委托的实现
Jul 20 Javascript
jQuery事件用法实例汇总
Aug 29 Javascript
EasyUI,点击开启编辑框,并且编辑框获得焦点的方法
Mar 01 Javascript
angularjs表格ng-table使用备忘录
Mar 09 Javascript
jQuery插件FusionCharts绘制的2D双面积图效果示例【附demo源码】
Apr 11 jQuery
boostrap模态框二次弹出清空原有内容的方法
Aug 10 Javascript
10行代码实现微信小程序滑动tab切换
Dec 28 Javascript
vue v-for 使用问题整理小结
Aug 04 Javascript
vue在路由中验证token是否存在的简单实现
Nov 11 Javascript
JS实现TITLE悬停长久显示效果完整示例
Feb 11 Javascript
使用TS来编写express服务器的方法步骤
Oct 29 Javascript
讲解JavaScript中for...in语句的使用方法
Jun 03 #Javascript
JavaScript中for循环的使用详解
Jun 03 #Javascript
详解JavaScript的while循环的使用
Jun 03 #Javascript
jQuery中extend()和fn.extend()方法详解
Jun 03 #Javascript
JavaScript中switch语句的用法详解
Jun 03 #Javascript
jquery中添加属性和删除属性
Jun 03 #Javascript
JavaScript中的条件判断语句使用详解
Jun 03 #Javascript
You might like
PHP错误Cannot use object of type stdClass as array in错误的解决办法
2014/06/12 PHP
php获取客户端电脑屏幕参数的方法
2015/01/09 PHP
Codeigniter发送邮件的方法
2015/03/19 PHP
动态表单验证的操作方法和TP框架里面的ajax表单验证
2017/07/19 PHP
Laravel中encrypt和decrypt的实现方法
2017/09/24 PHP
js 屏蔽鼠标右键脚本附破解方法
2009/12/03 Javascript
JSQL 基于客户端的成绩统计实现方法
2010/05/05 Javascript
Jquery ajaxsubmit上传图片实现代码
2010/11/04 Javascript
JavaScript之HTMLCollection接口代码
2011/04/27 Javascript
jquery控制左右箭头滚动图片列表的实例
2013/05/20 Javascript
div浮层,滚动条移动,位置保持不变的4种方法汇总
2013/12/11 Javascript
jQuery学习笔记之jQuery.extend(),jQuery.fn.extend()分析
2014/06/09 Javascript
node.js中的fs.openSync方法使用说明
2014/12/17 Javascript
js简单倒计时实现代码
2016/04/30 Javascript
JS控件bootstrap datepicker使用方法详解
2017/03/25 Javascript
JavaScript类的继承操作实例总结
2018/12/20 Javascript
[28:57]EG vs VGJ.T 2018国际邀请赛小组赛BO2 第二场 8.16
2018/08/16 DOTA
Python yield使用方法示例
2013/12/04 Python
python数据类型_元组、字典常用操作方法(介绍)
2017/05/30 Python
在java中如何定义一个抽象属性示例详解
2017/08/18 Python
对python中的高效迭代器函数详解
2018/10/18 Python
Keras使用ImageNet上预训练的模型方式
2020/05/23 Python
浅谈keras通过model.fit_generator训练模型(节省内存)
2020/06/17 Python
基于selenium及python实现下拉选项定位select
2020/07/22 Python
详解HTML5中表单验证的8种方法介绍
2016/12/19 HTML / CSS
GAP美国官网:美国休闲时尚品牌
2016/08/26 全球购物
马克华菲官方商城:Mark Fairwhale
2016/09/04 全球购物
全球酒店比价网:HotelsCombined
2017/06/20 全球购物
如何写好自荐信
2014/04/07 职场文书
大专生自荐书范文
2014/06/22 职场文书
2014年国庆节演讲稿
2014/09/02 职场文书
纪念九一八事变演讲稿:青少年应树立远大理想
2014/09/14 职场文书
2014年祖国生日寄语
2014/09/19 职场文书
导游词之大雁塔景区
2019/09/17 职场文书
python opencv常用图形绘制方法(线段、矩形、圆形、椭圆、文本)
2021/04/12 Python
游戏《我的世界》澄清Xbox版暂无计划加入光追
2022/04/03 其他游戏