首页 程序笔记 如何打破 JavaScript 循环以及为什么您可能需要这样做

如何打破 JavaScript 循环以及为什么您可能需要这样做

循环并不总是必须完成才能实现其目标。在这种情况下,尽早打破循环可以加快代码速度。

要点

  • JavaScript 循环对于重复代码至关重要,理解它们的语法和细微差别至关重要。
  • Break 语句可让您提前终止循环,从而提高代码执行效率。
  • 跳出循环可以优化代码,防止不必要的迭代,并有助于有效地处理错误。

JavaScript 的循环允许您重复代码,但有时您需要退出循环来处理特殊情况。这就是break语句的用武之地。了解break语句如何工作以及为什么您可能需要它。

了解 JavaScript 循环

JavaScript 循环允许您重复代码,保持程序整洁并减少重复。循环是一个重要的概念,几乎您编写的每个程序都会使用它。所以,如果你刚刚开始学习 JavaScript,你应该确保你彻底理解循环。

您应该熟悉的不同类型的 JavaScript 循环包括:

  • for循环
  • while 循环
  • do...while 循环
  • for…in 循环
  • for…of 循环

它们都执行迭代,但有细微的差别,使每个都适合不同的情况。以下是每种循环类型的语法:

循环类型:

 

for

语法:

for (init; cond; next) {
    // Code block
}

描述:

只要指定条件 (cond) 为真,就会运行代码块。初始化表达式 (init) 在循环开始时运行一次,而 next 表达式在每次循环到达代码块末尾时运行。

循环类型:

 

while

语法:

while (condition) {
    // Code block
}

描述:

只要指定条件为真,就运行代码块。

循环类型:

 

do…while

语法:

do {
    // Code block
} while (condition);

描述:

只要指定条件为真,就运行代码块。运行代码块后检查条件,因此始终至少运行一次。

循环类型:

 

for…in

语法:

for (property in object) {
    // Code block
}

描述:

为对象的每个属性运行代码块。

循环类型:

 

for…of

语法:

for (element of iterable) {
    // Code block
}

描述:

为可迭代对象(例如数组、字符串或映射)中的每个元素运行代码块。

“break”声明简介

Break 语句提前终止循环。随着循环的进行,一旦接触到break语句,它就会立即停止。这会导致程序在循环后继续执行下一条语句。

break 对于在不可预测的点停止循环非常有用,而不是等待运行多次迭代或主要条件变为 false。它有一个非常简单的语法:

break;

如何在不同的 JavaScript 循环中使用“break”

这些示例演示了如何打破每个可用的 JavaScript 循环。请特别注意局部变量的值以及它们的打印或计算时间。

跳出 for 循环

const numbers = [1, 2, 3, 4, 5];
let sum = 0;
for (let i = 0; i < numbers.length; i++)
{
    sum += numbers[i];
    if (sum > 5)
    {
        break;
    }
}
console.log(sum); // Output: 6

此代码使用 for 循环对元素数组求和。该循环迭代数组的每个元素,并对它们求和。该条件检查总和是否超过 5。如果超过,break 语句将终止循环。

跳出 While 循环

const numbers = [1, 2, 3, 4, 5];
let product = 1;
let i = 0;
while (i < numbers.length)
{
    product *= numbers[i];
    if (product > 10)
    {
        break;
    }
    i++;
}
console.log(product); // Output: 24

此代码使用 while 循环来查找数组中元素的乘积。该循环迭代数组的每个元素,计算乘积。条件内的break语句将在乘积超过10时停止循环。

跳出 Do…While 循环

let i = 1;
do
{
    if (i % 2 === 0)
    {
       console.log(i);
    }
    i++;
    if (i > 5)
    {
       break; 
    }
} while (i <= 10);
// Output:
// 2
// 4

do...while 循环迭代从 1 到 10 的数字,打印偶数。 if 条件中的break 语句检查循环计数器是否超过5。如果条件为真,则继续退出循环。

跳出 for...in 循环

const sentence = "Hello";
let result = "";
for (let index in sentence)
{
    if (index == 2)
    {
        break;
    }
    result += sentence[index];
}
console.log(result);
// Output: He

该循环迭代字符串中的每个字符,并将它们连接起来。这里,条件检查循环索引是否等于2。如果是,则使用break退出循环。

跳出 for...of 循环

const numbers = [1, 2, 3, 4, 5];
for (let num of numbers.reverse())
{
    console.log(num);
    if (num === 3)
    {
        break;
    }
}
// Output:
// 5
// 4
// 3

该循环以相反的顺序迭代数组的每个元素,并将它们连接起来。如果循环遇到值3,它将通过break语句退出。

打破循环的重要性

跳出循环可能是优化代码的有效方法。尽早退出循环可以防止不必要的迭代,降低时间复杂度,并允许您有效地处理错误。

重点练习如何打破程序中的不同 JavaScript 循环,以加强您的理解。


3

站心网

循环并不总是必须完成才能实现其目标。在这种情况下,尽早打破循环可以加快代码速度。要点JavaScript 循环..

为您推荐

.NET C# 过滤从富文本编辑器html里的Javascript脚本

富文本编辑器在允许用户输入丰富内容的同时,也带来了跨站脚本攻击(XSS)的风险。过滤提交的 HTML 中的 <script> 脚本是防止跨站脚本攻击(XSS)的关键步骤。在 .NET C# 服务端过滤 <script> 脚本主要有以下几种方..

img标签的onerror事件 以及 无限循环报错问题

有时,img标签中的src图片加载失败,原来的图片位置会出现一个碎片图标,这样让人很不爽,如何变得美观些呢?可以借用img标签的onerror事件,img标签支持onerror事件,在装载文档或图像的过程中如果发生了错误,就会..

轻松学习 JavaScript函数中的默认参数

JavaScript函数可以有默认参数值。通过默认函数参数,你可以初始化带有默认值的正式参数。如果不初始化具有某些值的参数,则该参数的默认值为undefined。请看下列代码:function foo(num1){console.log(num1);}foo()..

JavaScript API 设计原则详解

前言本篇博文来自一次公司内部的前端分享,从多个方面讨论了在设计接口时遵循的原则,总共包含了七个大块。系卤煮自己总结的一些经验和教训。本篇博文同时也参考了其他一些文章,相关地址会在后面贴出来。很难做到详..

JavaScript 中精度问题以及解决方案

JavaScript 中的数字按照 IEEE 754 的标准,使用 64 位双精度浮点型来表示。其中符号位 S,指数位 E,尾数位M分别占了 1,11,52 位,并且在ES5 规范中指出了指数位E的取值范围是[-1074, 971]。精度问题汇总想用有限..

JavaScript 六种继承方式

继承是面向对象编程中又一非常重要的概念,JavaScript支持实现继承,不支持接口继承,实现继承主要依靠原型链来实现的。原型链首先得要明白什么是原型链,在一篇文章看懂proto和prototype的关系及区别中讲得非常详细..

JavaScript 事件委托详解

基本概念事件委托,通俗地来讲,就是把一个元素响应事件(click、focus……)的函数委托到另一个元素;一般来讲,会把一个或者一组元素的事件委托到它的父层或者更外层元素上,真正绑定事件的是外层元素,当事件响应..

JavaScript 中的遍历详解

编程这么多年,要是每次写遍历代码时都用 for 循环,真心感觉对不起 JavaScript 语言~对象遍历为了便于对象遍历的测试,我在下面定义了一个测试对象obj。测试对象// 为 Object 设置三个自定义属性(可枚举)Object.p..

值得探索的 8 个机器学习 JavaScript 框架

JavaScript开发人员倾向于寻找可用于机器学习模型训练的JavaScript框架。下面是一些机器学习算法,基于这些算法可以使用本文中列出的不同JavaScript框架来模型训练:简单的线性回归多变量线性回归逻辑回归朴素贝叶斯..

JavaScript 保留两位小数

以下我们将为大家介绍 JavaScript 保留两位小数的实现方法:四舍五入以下处理结果会四舍五入:var num =2.446242342;num = num.toFixed(2); // 输出结果为 2.45不四舍五入以下处理结果不会四舍五入:第一种,先把小数边..

JavaScript 页面跳转、页面重定向

JavaScript 实现页面跳转重定向可以使用以下两种方法:window.location.replace("url")类似 HTTP 重定向将地址替换成新 url,该方法通过指定 URL 替换当前缓存在历史里(客户端)的项目,因此当使用 replace 方法之..

在 Javascript 中 声明时用 var 与不用 var 的区别

avascript 声明变量的时候,虽然用 var 关键字声明和不用关键字声明,很多时候运行并没有问题,但是这两种方式还是有区别的。可以正常运行的代码并不代表是合适的代码。var num = 1;是在当前域中声明变量。如果在方..

javascript中call()、apply()、bind()的用法终于理解

其实是一个很简单的东西,认真看十分钟就从一脸懵B 到完全 理解!先看明白下面:例 1obj.objAge; // 17obj.myFun() // 小张年龄 undefined例 2shows() // 盲僧 比较一下这两者 this 的差别,第一个打印里面的 this ..

5 个顶级的 JavaScript Ajax 组件和库

在这篇文章中,我们将介绍一些用于AJAX调用的最好的JS库,包括jQuery,Axios和Fetch。欢迎查看代码示例!AJAX是用来对服务器进行异步HTTP调用的一系列web开发技术客户端框架。 AJAX即Asynchronous JavaScript and XM..

5 分钟掌握 JavaScript 实用窍门

简评:一开始 JavaScript 只是为网页增添一些实时动画效果,现在 JS 已经能做到前后端通吃了,而且还是年度流行语言。本文分享几则 JS 小窍门,可以让你事半功倍 ~1. 删除数组尾部元素一个简单方法就是改变数组的len..

.NET 主程序的.dll.config文件有什么用?

.dll.config 文件通常是在开发过程中自动生成的,它的主要作用是为某个类库(.dll 文件)提供一个独立的配置文件,以便开发者可以为该类库单独定义或测试配置项。以下是生成 .dll.config 文件的原因和机制:1. 配置..

CPU、GPU 和 TPU 之间有什么区别?

什么是 CPU、GPU 和 TPU?它们都是用于计算任务的处理器芯片。可以把你的大脑想象成一台计算机,能够完成诸如阅读书籍或解决数学问题的任务。每一项活动都类似于一个计算任务。例如,当你用手机拍照、发送短信或打开..

ASP.NET如何将Views文件夹从项目分离

将 Views 文件夹从 ASP.NET 项目中分离是一个常见需求,比如为了实现模块化或分层架构。以下是实现此功能的完整步骤,从项目中分离 Views 文件夹,将其移到另一个独立的文件夹或项目中,并确保视图渲染仍然正常。1. ..

如何让AI写出Google认可的文章?

让 AI 写出 Google 认可的文章,核心在于满足 Google 的搜索排名算法要求。这些要求通常围绕以下几个关键点展开:内容质量、用户体验 和 SEO 优化。以下是详细指导:一、内容质量确保文章原创且有价值避免抄袭:Goog..

JavaScript中字典的常用操作

字典是一种以键值对存在的数据结构,他的底层是Array数组字典初始化和数组初始化的区别:数组的初始化:var arr = [1,2,3,4,5];//使用中括号字典的初始化: var names = {“a”:“aaa”,“b”:“bbb”,“c”:“ccc”}..

发表回复

返回顶部