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 eval函数深入认识
Feb 21 Javascript
js 匿名调用实现代码
Jun 19 Javascript
flash调用js中的方法,让js传递变量给flash的办法及思路
Aug 07 Javascript
JavaScript实现检查页面上的广告是否被AdBlock屏蔽了的方法
Nov 03 Javascript
JavaScript文本框脚本编写的注意事项
Jan 25 Javascript
javascript每日必学之条件分支
Feb 17 Javascript
ionic隐藏tabs的方法
Aug 29 Javascript
JS实现加载时锁定HTML页面元素的方法
Jun 24 Javascript
VUE-Table上绑定Input通过render实现双向绑定数据的示例
Aug 27 Javascript
微信小程序使用npm支持踩坑
Nov 07 Javascript
js实现带搜索功能的下拉框
Jan 11 Javascript
基于原生JS封装的Modal对话框插件的示例代码
Sep 09 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 变量类型的强制转换
2009/10/23 PHP
php 使用post,get的一种简洁方式
2010/04/25 PHP
php操作excel文件 基于phpexcel
2010/07/02 PHP
thinkphp项目如何自定义微信分享描述内容
2017/02/20 PHP
PHP count_chars()函数讲解
2019/02/14 PHP
Laravel配置全局公共函数的方法步骤
2019/05/09 PHP
分析 JavaScript 中令人困惑的变量赋值
2007/08/13 Javascript
JavaScript 异步调用框架 (Part 1 - 问题 &amp; 场景)
2009/08/03 Javascript
js 函数的副作用分析
2011/08/23 Javascript
jquery mobile事件多次绑定示例代码
2013/09/13 Javascript
解决html按钮切换绑定不同函数后点击时执行多次函数问题
2014/05/14 Javascript
简单方法判断JavaScript对象为null或者属性为空
2014/09/26 Javascript
javascript三种代码注释方法
2016/06/02 Javascript
微信小程序 loading 详解及实例代码
2016/11/09 Javascript
Vue.js实战之通过监听滚动事件实现动态锚点
2017/04/04 Javascript
利用Angular2 + Ionic3开发IOS应用实例教程
2018/01/15 Javascript
微信小程序实现省市区三级地址选择
2020/06/21 Javascript
vue父子组件通信的高级用法示例
2019/08/29 Javascript
王纯业的Python学习笔记 下载
2007/02/10 Python
使用 Python 实现文件递归遍历的三种方式
2018/07/18 Python
django如何连接已存在数据的数据库
2018/08/14 Python
浅谈django orm 优化
2018/08/18 Python
numpy 对矩阵中Nan的处理:采用平均值的方法
2018/10/30 Python
Python利用matplotlib做图中图及次坐标轴的实例
2019/07/08 Python
PyTorch加载预训练模型实例(pretrained)
2020/01/17 Python
Python读取JSON数据操作实例解析
2020/05/18 Python
Keras预训练的ImageNet模型实现分类操作
2020/07/07 Python
英国最大的宠物食品和宠物用品网上零售商: Zooplus
2016/08/01 全球购物
美国羊皮公司:Overland
2018/01/15 全球购物
视光学专业毕业生推荐信
2013/10/28 职场文书
中专毕业生自我鉴定
2014/02/02 职场文书
党员目标管理责任书
2014/07/25 职场文书
庆六一活动总结
2014/08/29 职场文书
2014年教师节国旗下讲话稿
2014/09/10 职场文书
客房领班岗位职责
2015/02/11 职场文书
使用kubeadm命令行工具创建kubernetes集群
2022/03/31 Servers