JavaScript跳出循环的三种方法(break, return, continue)


Posted in Javascript onJuly 30, 2019

前言:

一位前端界的大神让我去思考的一个问题, 给了Big-man一段代码,如下:

function Seriously(options) {
  // if called without 'new', make a new object and return that
  if(window === this || !(this instanceof Seriously) || this.id !== undefined) {
    return new Seriously(options);
  }
}

return语句执行之后还会继续执行吗?这是大神上来让我解决的问题,既然提到了return那我也就随带解决JS中另外的两种结束循环的方法break, continue。

Break语句:

  • break语句会使运行的程序立刻退出包含在最内层的循环或者退出一个switch语句。
  • 由于它是用来退出循环或者switch语句的, 所以只有当它出现在这些语句的时候, 这种形式的break语句才是合法的。
  • 如果一个循环的终止条件非常复杂, 那么使用break语句来实现某些条件比用一个循环表达式所有的条件容易得多。
for(var i = 519; i < 550; i++) {
  if(i == 522) {
    break;
  }
  console.log(i);
  alert(i);
  document.write(i);
}
  • 当i = 521的时候,直接退出for这个循环。这个循环将不再被执行。
  • 对于输出结果的话,可以自己去测试的吧。

Continue语句:

  • continue语句和break语句相似。所不同的是,它不是退出一个循环,而是开始循环的一次新迭代。
  • continue语句只能用在while语句、do/while语句、for语句、或者for/in语句的循环体内, 在其他地方使用都会引起错误?
for(var i = 5; i >=0; i--) {
  if(i == 4 || i == 3 || i == 1) {
    continue;
  }
  console.log(i);
  alert(i);
  document.write(i);
}
  • 当i = 4、i = 3以及i = 1的时候,直接跳出for循环。下次继续执行。
  • 至于输出结果,还希望大家去打印一下。

Return语句:

return语句就是用于指定函数返回的值。return语句只能出现在函数体内,出现在代码中的其他任何地方造成语法错误!

for(var i = 1; i < 10; i++) {
  if(i == 8) {
    return;
  }
  console.log(i);
  alert(i);
  document.write(i);
}

执行结果Uncaught SyntaxError: illegal return statement(...)

  • 错误意思是非法捕获的查询返回语句。

当执行return语句时, 即使函数主题中还有其他语句, 函数执行也会停止!

<script type="text/javascript">
  if(username == "") {
    alert("please input your username: ");
    return false;
  } else if (qq == "") {
    alert("please input your qq number: ");
    return false;
  }
</script>

上面的实例里,当username为空时,就不会再向下执行,在一些表单提交中,也可以通过return false来阻止默认的提交方式,改用Ajax的提交方式,例如:

<form id="form" onSubmit="return false">
...
</form>

this对应的全局变量:

window == this这个Boolean等式,在不同的情况下的展现都不一样的。

<!DOCTYPE html>
<html>
<head>
  <title></title>
</head>

<body>
<script type="text/javascript">
  function a() {
    console.log(window === this)
  }
  a();
</script>
</body>
</html>

这个时候的window === this打印出来的是true,这也就意味着this绝对等于window。

<!DOCTYPE html>
<html>
<head>
  <title></title>
</head>

<body>
<script type="text/javascript">
  'use strict'
  function a() {
    console.log(window === this)
  }
  a();
</script>
</body>
</html>

这个时候window === this返回回来的值却是false, 而且打印出来的this是undefined的。

所以严格模式下面的代码操作需要更加的规范和合理才可以的。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Javascript Object.extend
May 18 Javascript
用JavaScript实现一个代码简洁、逻辑不复杂的多级树
May 23 Javascript
最流行的Node.js精简型和全栈型开发框架介绍
Feb 26 Javascript
JavaScript把数组作为堆栈使用的方法
Mar 20 Javascript
JS+CSS实现仿msn风格选项卡效果代码
Oct 22 Javascript
基于HTML+CSS,jQuery编写的简易计算器后续(添加了键盘监听)
Jan 05 Javascript
fullPage.js和CSS3实现全屏滚动效果
May 05 Javascript
js实现网页的两个input标签内的数值加减(示例代码)
Aug 15 Javascript
vue项目webpack中Npm传递参数配置不同域名接口
Jun 15 Javascript
zepto.js 实时监听输入框的方法
Dec 04 Javascript
layUI实现前端分页和后端分页
Jul 27 Javascript
Vue实现浏览器打印功能的代码
Apr 17 Javascript
8个有意思的JavaScript面试题
Jul 30 #Javascript
开源一个微信小程序仪表盘组件过程解析
Jul 30 #Javascript
原生js添加一个或多个类名的方法分析
Jul 30 #Javascript
vue2.0项目集成Cesium的实现方法
Jul 30 #Javascript
Koa从零搭建到Api实现项目的搭建方法
Jul 30 #Javascript
js实现的格式化数字和金额功能简单示例
Jul 30 #Javascript
JS实现点击发送验证码 xx秒后重新发送功能
Jul 30 #Javascript
You might like
php的list()的一步操作给一组变量进行赋值的使用
2011/05/18 PHP
php ckeditor上传图片文件名乱码解决方法
2013/11/15 PHP
PHP中替换键名的简易方法示例详解
2014/01/07 PHP
PHP生成树的方法
2015/07/28 PHP
PHP微信开发之查询城市天气
2016/06/23 PHP
详细对比php中类继承和接口继承
2018/10/11 PHP
Laravel 5+ .env环境配置文件详解
2020/04/06 PHP
用jquery实现学校的校历(asp.net+jquery ui 1.72)
2010/01/01 Javascript
JavaScript 放大镜 放大倍率和视窗尺寸
2011/05/09 Javascript
JS图片无缝、平滑滚动代码
2014/03/11 Javascript
jQuery选择器源码解读(六):Sizzle选择器匹配逻辑分析
2015/03/31 Javascript
BootstrapTable+KnockoutJS自定义T4模板快速生成增删改查页面
2016/08/01 Javascript
Angularjs cookie 操作实例详解
2017/09/27 Javascript
微信小程序 setData 对 data数据影响问题
2019/04/18 Javascript
layui 对弹窗 form表单赋值的实现方法
2019/09/04 Javascript
ES6中let、const的区别及变量的解构赋值操作方法实例分析
2019/10/15 Javascript
Vue 自适应高度表格的实现方法
2020/05/13 Javascript
Python的SQLAlchemy框架使用入门
2015/04/29 Python
python类的继承实例详解
2017/03/30 Python
python 对给定可迭代集合统计出现频率,并排序的方法
2018/10/18 Python
python实现自动登录后台管理系统
2018/10/18 Python
python3 requests库文件上传与下载实现详解
2019/08/22 Python
python中with语句结合上下文管理器操作详解
2019/12/19 Python
使用tensorboard可视化loss和acc的实例
2020/01/21 Python
keras输出预测值和真实值方式
2020/06/27 Python
基于OpenCV的路面质量检测的实现
2020/11/04 Python
css3实现可滑动跳转的分页插件示例
2014/05/08 HTML / CSS
html5+css3进度条倒计时动画特效代码【推荐】
2016/03/08 HTML / CSS
购买正版游戏和游戏激活码:Green Man Gaming
2019/11/06 全球购物
Michael Kors澳大利亚官网:世界知名的奢侈饰品和成衣设计师
2020/02/13 全球购物
阿迪达斯越南官网:adidas越南
2020/07/19 全球购物
综艺节目策划方案
2014/06/13 职场文书
法务专员岗位职责
2015/02/14 职场文书
党员评议自我评价
2015/03/03 职场文书
最感人的道歉情书
2015/05/12 职场文书
风雨哈佛路观后感
2015/06/03 职场文书