详解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 相关文章推荐
IE6/IE7中JavaScript json提示缺少标识符、字符串或数字问题处理
Dec 16 Javascript
高性能JavaScript模板引擎实现原理详解
Feb 05 Javascript
JavaScript中使用Math.floor()方法对数字取整
Jun 15 Javascript
jquery实现用户信息修改验证输入方法汇总
Jul 18 Javascript
jQuery+CSS实现一个侧滑导航菜单代码
May 09 Javascript
js以分隔符分隔数组中的元素并转换为字符串的方法
Nov 16 Javascript
关于vue v-for 循环问题(一行显示四个,每一行的最右边那个计算属性)
Sep 04 Javascript
mock.js实现模拟生成假数据功能示例
Jan 15 Javascript
微信小程序实现单选选项卡切换效果
Jun 19 Javascript
微信小程序基于canvas渐变实现的彩虹效果示例
May 03 Javascript
详解ES6数组方法find()、findIndex()的总结
May 12 Javascript
关于javascript中的promise的用法和注意事项(推荐)
Jan 15 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
四月新番又没了,《Re:从零开始的异世界生活》第二季延期至7月播出
2020/05/06 日漫
PHP表单验证的3个函数ISSET()、empty()、is_numeric()的使用方法
2011/08/22 PHP
一些常用的Javascript函数
2006/12/22 Javascript
js 编程笔记 无名函数
2011/06/28 Javascript
JavaScript单元测试ABC
2012/04/12 Javascript
用jQuery获取IE9下拉框默认值问题探讨
2013/07/22 Javascript
对js关键字命名的疑问介绍
2014/04/25 Javascript
JavaScript 事件对象介绍
2015/04/13 Javascript
jQuery实现在最后一个元素之前插入新元素的方法
2015/07/18 Javascript
jQuery基于cookie实现的购物车实例分析
2015/12/24 Javascript
JavaScript对象参数的引用传递
2016/01/14 Javascript
概述一个页面从输入URL到页面加载完的过程
2016/12/16 Javascript
easyUI实现类似搜索框关键词自动提示功能示例代码
2016/12/27 Javascript
AngularJS与后端php的数据交互方法
2018/08/13 Javascript
如何解决vue2.0下IE浏览器白屏问题
2018/09/13 Javascript
node(koa2) web应用模块介绍详解
2019/03/29 Javascript
layui实现三级导航菜单
2019/07/26 Javascript
vue相同路由跳转强制刷新该路由组件操作
2020/08/05 Javascript
Python中使用item()方法遍历字典的例子
2014/08/26 Python
python实现自动更换ip的方法
2015/05/05 Python
python 时间戳与格式化时间的转化实现代码
2016/03/23 Python
Python一键安装全部依赖包的方法
2019/08/12 Python
python已协程方式处理任务实现过程
2019/12/27 Python
在python中使用pymysql往mysql数据库中插入(insert)数据实例
2020/03/02 Python
Python批量修改xml的坐标值全部转为整数的实例代码
2020/11/26 Python
python实现启动一个外部程序,并且不阻塞当前进程
2020/12/05 Python
澳大利亚相机之家:Camera House
2017/11/30 全球购物
用C#语言写出在本地创建一个UDP接收端口的具体过程
2016/02/22 面试题
超市端午节活动方案
2014/01/23 职场文书
协商一致解除劳动合同协议书
2014/09/14 职场文书
先进人物事迹材料
2014/12/29 职场文书
摘录式读书笔记
2015/07/01 职场文书
食堂管理制度范本
2015/08/04 职场文书
军训心得体会范文(2016最新篇)
2016/01/11 职场文书
2019七夕节祝福语36句,快来收藏吧
2019/08/06 职场文书
Java 多线程协作作业之信号同步
2022/05/11 Java/Android