详解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 相关文章推荐
如何用js控制css中的float的代码
Aug 16 Javascript
自己整理的一个javascript日期处理函数
Oct 16 Javascript
jQuery的each终止或跳过示例代码
Dec 12 Javascript
javascript 控制input只允许输入的各种指定内容
Jun 19 Javascript
JS显示下拉列表框内全部元素的方法
Mar 31 Javascript
jQuery实现首页图片淡入淡出效果的方法
Jun 10 Javascript
javascript中this指向详解
Apr 23 Javascript
JavaScript浏览器对象之一Window对象详解
Jun 03 Javascript
Canvas放置反弹效果随机图形(实例)
Aug 17 Javascript
layui表格 列自动适应大小失效的解决方法
Sep 06 Javascript
react用Redux中央仓库实现一个todolist
Sep 29 Javascript
JS实现的进制转换,浮点数相加,数字判断操作示例
Nov 09 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+MSSQL分页的例子
2006/10/09 PHP
开源SNS系统-ThinkSNS
2008/05/18 PHP
PHP开发不能违背的安全规则 过滤用户输入
2011/05/01 PHP
javascript prototype 原型链
2009/03/12 Javascript
用js实现计算加载页面所用的时间
2010/04/02 Javascript
javascript 设计模式之单体模式 面向对象学习基础
2010/04/18 Javascript
JavaScript 原型继承之构造函数继承
2011/08/26 Javascript
网页防止tab键的使用快速解决方法
2013/11/07 Javascript
javascript实现数字验证码的简单实例
2014/02/10 Javascript
jQuery+jRange实现滑动选取数值范围特效
2015/03/14 Javascript
JS实现的数组全排列输出算法
2015/03/19 Javascript
点评js异步加载的4种方式
2015/12/22 Javascript
JavaScript实现图片懒加载(Lazyload)
2016/11/28 Javascript
完美解决jQuery fancybox ie 无法显示关闭按钮的问题
2016/11/29 Javascript
Vue基础配置讲解
2019/11/29 Javascript
vue组件传值的实现方式小结【三种方式】
2020/02/05 Javascript
python实现的登陆Discuz!论坛通用代码分享
2014/07/11 Python
python实现图像识别功能
2018/01/29 Python
Python 实现在文件中的每一行添加一个逗号
2018/04/29 Python
python批量导入数据进Elasticsearch的实例
2018/05/30 Python
Django命名URL和反向解析URL实现解析
2019/08/09 Python
Python3 hashlib密码散列算法原理详解
2020/03/30 Python
解决IDEA 的 plugins 搜不到任何的插件问题
2020/05/04 Python
施华洛世奇加拿大官网:SWAROVSKI加拿大
2018/06/03 全球购物
康帕斯酒店预订:Compass Hospitality(支持中文)
2018/08/23 全球购物
世界上最大的艺术社区:SAA
2020/12/30 全球购物
大学生实习期自我评价范文
2013/10/03 职场文书
员工薪酬激励方案
2014/06/13 职场文书
一份关于丢失公司财物的检讨书
2014/09/19 职场文书
“四风”查摆问题自我剖析材料
2014/09/27 职场文书
简易离婚协议书(范本)
2014/10/25 职场文书
单位未婚证明范本
2014/11/25 职场文书
2014年英语工作总结
2014/12/20 职场文书
公司趣味运动会开幕词
2016/03/04 职场文书
学生早退检讨书(范文)
2019/08/19 职场文书
聊一聊python常用的编程模块
2021/05/14 Python