详解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 相关文章推荐
JQuery的Alert消息框插件使用介绍
Oct 09 Javascript
使用jQuery+HttpHandler+xml模拟一个三级联动的例子
Aug 09 Javascript
Jquery插件easyUi表单验证提交(示例代码)
Dec 30 Javascript
实现checkbox全选、反选、取消JavaScript小脚本异常
Apr 10 Javascript
js实现横向百叶窗效果网页切换动画效果的方法
Mar 02 Javascript
javascript基于DOM实现省市级联下拉框的方法
May 14 Javascript
JS实现的自定义右键菜单实例二则
Sep 01 Javascript
jQuery插件ajaxFileUpload异步上传文件
Oct 19 Javascript
值得分享的Bootstrap Table使用教程
Nov 23 Javascript
通过一次报错详细谈谈Point事件
May 17 Javascript
Angular2 自定义表单验证器的实现方法
Dec 14 Javascript
vue 出现data-v-xxx的原因及解决
Aug 04 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构造函数与析构函数
2016/04/23 PHP
Yii净化器CHtmlPurifier用法示例(过滤不良代码)
2016/07/15 PHP
thinkphp自带验证码全面解析
2016/09/18 PHP
PHP简单判断iPhone、iPad、Android及PC设备的方法
2016/10/11 PHP
PHP在linux上执行外部命令的方法
2017/02/06 PHP
PHP程序员必须知道的两种日志实例分析
2020/05/14 PHP
50个优秀经典PHP算法大集合 附源码
2020/08/26 PHP
如何用js控制css中的float的代码
2007/08/16 Javascript
JsDom 编程小结
2011/08/09 Javascript
onkeydown事件解决按回车键直接提交数据的需求
2013/04/11 Javascript
js判断为空Null与字符串为空简写方法
2014/02/24 Javascript
javascript 寻找错误方法整理
2014/06/15 Javascript
node.js中的querystring.escape方法使用说明
2014/12/10 Javascript
JavaScript将XML转成JSON的方法
2015/03/12 Javascript
JavaScript返回0-1之间随机数的方法
2015/04/06 Javascript
BootstrapValidator不触发校验的实现代码
2016/09/28 Javascript
几种tab切换详解
2017/02/03 Javascript
vue.js实现刷新当前页面的方法教程
2017/07/05 Javascript
angular实现spa单页面应用实例
2017/07/10 Javascript
Javascript实现时间倒计时效果
2017/07/15 Javascript
基于vue-cli3和element实现登陆页面
2019/11/13 Javascript
javascript将扁平的数据转为树形结构的高效率算法
2020/02/27 Javascript
vue 中的 render 函数作用详解
2020/02/28 Javascript
使用Python编写一个模仿CPU工作的程序
2015/04/16 Python
Python中Django发送带图片和附件的邮件
2017/03/31 Python
Python列表原理与用法详解【创建、元素增加、删除、访问、计数、切片、遍历等】
2019/10/30 Python
HTML5和CSS3让网页设计提升到下一个高度
2009/08/14 HTML / CSS
Goodee官方商店:迷你投影仪
2021/03/15 全球购物
kfc实习自我鉴定
2013/12/14 职场文书
韩国商务邀请函
2014/01/14 职场文书
表彰会主持词
2014/03/26 职场文书
驾驶员安全责任书
2014/07/22 职场文书
保安2014年终工作总结
2014/12/06 职场文书
小学生表扬稿范文
2015/05/05 职场文书
2015年信息中心工作总结
2015/05/25 职场文书
win11怎么用快捷键锁屏? windows11锁屏的几种方法
2021/11/21 数码科技