用于JavaScript中的循环和同时循环

更新日期: 2019-04-07阅读: 2.7k标签: 循环

JavaScript中的循环是什么?

循环只需多次运行一段代码。例如,看看下面的代码:

alert('Hi!');

如果我们想重复这五次,我们可以这样做:

alert('Hi!');
alert('Hi!');
alert('Hi!');
alert('Hi!');
alert('Hi!');

然而,这是一个非常糟糕的编程,如果您需要重复大量的代码数百次,这会变得非常笨拙。而且,它也不是很有用。例如,如果希望它重复X次呢?这就是循环的用武之地。次数通常由变量决定,但也可以由实际数字决定。循环对于对数组中的每个元素(列表中的每个项)都特别有用,但在许多情况下都很有用。


同时循环

等等,如果我们先执行while循环,那么标题为什么以“for”开头?我真的不知道,只是这样听起来更好。  while循环会在特定的语句中一次又一次地重复代码。true(即直到它是false)。下面是语法

while ( /* something that's true or false */ ) {
    // Do some stuff
}

就这么简单!下面是一个例子,它不断地从0-1直到一切结束0.2.

while(Math.random() > 0.2) {
    alert('hi');
}

但如果我们想让它报警呢?我们不能写alert(Math.random())因为那样它就会发现新的随机数警报。所以,我们必须做一个变量,然后把它设为每个循环末尾的随机数。然后它会比较这,这个数字,并将其存储在一个变量中,这样我们可以在以后通知它:

var randomNum = Math.random();

while(randomNum > 0.2) {
    alert(randomNum);
    randomNum = Math.random();
}

花点时间看看这段代码。首先,我们设置变量randomNum随机数。然后我们看看它是否大于0.2。如果是的话,我们在花括号里运行这些东西。这会提醒号码,然后更改。randomNum换个新号码。然后我们检查一下这,这个数大于0.2。如果是的话,我们再次在花括号内运行这些内容,然后在…上继续运行。

如果号码是不大于0.2,括号中的内容没有运行,程序继续运行。它不然后继续运行,直到数字大于0.2再来一次。


注意…避免无限循环!

无限循环是将永远运行的循环。它们可以在这两个for循环中发生。和同时循环。以下是一个非常基本的例子-不要尝试,除非你没问题丢失你所有的标签  

while(true) {
    // some code
}

它将冻结页面,甚至整个浏览器将取决于您的计算机。您通常无法关闭选项卡,并且可能需要退出并重新打开整个浏览器!所以,总是要注意无限循环。它们可能并不总是像while(true)。可能会吧任何语句,该语句将始终计算为true. 

 

循环

假设你想提醒“嗨”五次。正如我前面所说,这是一种非常糟糕的做事方式:

alert('Hi!');
alert('Hi!');
alert('Hi!');
alert('Hi!');
alert('Hi!');

但是,我们如何使用while循环来完成这个任务呢?我们必须设置一个计数器变量,然后每次添加一个:

var counter = 1;

while(counter <= 5) {
    alert('Hi!');
    counter = counter + 1;
}

首先,让我们让这段代码遵循更好的编程约定。而不是使用counter变量,我们应该给它命名i。这只是一个惯例,代表‘迭代’。你不用用i,但这样做是个好主意。它将使您的代码更容易与其他开发人员的代码集成,并使一切更加一致。

另外,我们要启动柜台1。在编程中,启动计数器变量是一种惯例。0。好呀1?在大多数编程语言中,列阵(列表)是项目0,而不是项目1。考虑到循环通常与数组一起使用,最好的编程约定是在0。虽然一开始它可能看起来很混乱,但随着您学习JavaScript的进展,它将使您的代码变得不那么混乱。因为i现在少了一个,我们会说counter < 5而不是counter <= 5.

最后,我们增加了一条线i增加1。而不是说i = i + 1有更好的方法来做这件事!你可以简单地说i++;.

因此,以下是我们的while循环在让它遵循良好的编程约定(“最佳实践”)之后的样子:

var i = 0;

while(i < 5) {
    alert('Hi!');
    i++;
}

信不信由你,使用JavaScript有一种更快、更好、更容易做到这一点的方法!它是通过使用for循环来实现的:

for(var i = 0; i < 5; i++) {
    alert('Hi!');
}

让我们看看这段代码。它非常类似于while循环,只不过所有不同的部分都被移动了。再一次,我们用i作为我们的反变量。

所以首先,我们要i到0。我们没有在循环之前这样做,而是在for循环的括号内,就在开始时这样做。

在分号之后,我们有一个布尔型表达式(计算结果为true或false)。这就像When循环中的部件,并以相同的方式操作!花括号中的内容将运行,而该语句等效于true(在这种情况下,i < 5).

在第二个分号之后,括号中有最后一段代码:i++。这只是我们的最后一行在花括号内从When循环!简而言之,第二个分号之后的代码将在循环每次重复的末尾运行。

下面是for循环语法的总结,以便更容易理解:

for( /* Set your counter variable */ ; /* Repeat while this is true */ ; /* Run this at the end of each repetition */ ) {
    // Your code!
}

尝试做一个for循环,提醒“Yay”三次。**不要用代码重复五遍来帮助你!**看看你是否可以仅仅使用语法代码来帮助你

答案:

for(var i = 0; i < 3; i++) {
    alert('Yay');
}

另外,你也可以用i 内你的代码在花括号里!虽然这对于迭代是很方便的阵列它可以任意使用。例如,从0-4发出警报:

for(var i = 0; i < 5; i++) {
    alert(i);
}

注意,它是从0-4而不是1-5开始的,因为所有循环都应该从0开始!如果您想从1-5发出警报,我将执行以下操作:

for(var i = 0; i < 5; i++) {
    alert(i + 1);
}


结语

恭喜学习所有关于循环和同时循环!我知道,当我学习的时候,我发现for循环的概念特别令人困惑。记住括号里的三个部分是相当困难的,而我最终得到它的唯一方法就是通过练习。所以,尝试使用for(和while)循环做一些不同的事情!这是最好的学习方法。

英文原文:https://codetheweb.blog/2018/03/25/for-and-while-loops-javascript/ 

 

链接: https://fly63.com/article/detial/2760

跳出 forEach

使用for...in遍历对象时,会遍历原型链上的可枚举属性,这可能会导致一些意想不到的问题。所以你一定收到过这样的建议,使用数组的forEach来代替for...in循环。本文给大家总结了5种在forEach中跳出循环的变通之法

JavaScript循环下的async/await

在进行业务开发的过程中,使用了数组的高级函数map,同时使用了ES6语法async/await,发现在map循环下任务是异步执行的,并不符合预期。Array的循环方法map、forEach、filter、reduce、some、every等是并行迭代,可以理解为async/await的效果是无效的

如何中断forEach循环

在使用for循环的时候可以使用break 或者return语句来结束for循环(return直接结束函数),但是如果使用forEach循环如何跳出循环呢?首先尝试一使用return语句----木有效果

Js中循环执行

循环:就是一遍又一遍执行相同或者相似的代码,循环的两个要素:循环体:重复执行的代码;循环条件:控制循环的次数

为啥要放弃for循环?

创建一个新的数组,新的数组中的元素是通过检查指定数组中符合条件的元素;注意:1. filter()不会对空数组进行检测;2. filter()不会改变源是数组;

解决使用Vue-Router出现无限循环问题

我在项目里面用到了的是全局守卫,beforeEach,方便管理 不过遇到了一个问题,就是在beforeEach()中设置好判断条件后出现了无限循环的问题 当时的代码如下:

Node.js事件循环

对于本文中一些知识点任然有些模糊,懵懵懂懂,一直都在学习中,通过学习事件循环也看了一些文献,在其中看到了这一句话:除了你的代码,一切都是同步的,我觉得很有道理,对于理解事件循环很有帮助。

关于for循环中使用setTimeout的四种解决方案

我们先来简单了解一下setTimeout延时器的运行机制。setTimeout会先将回调函数放到等待队列中,等待区域内其他主程序执行完毕后,按时间顺序先进先出执行回调函数。本质上是作用域的问题

Js循环的几种方法

for 常用于循环数组 ,for in 常用来循环对象,不建议循环数组,因为i是字符串 可能会有隐患问题,for in 循环会找到 prototype 上去,所以最好在循环体内加一个判断

vue 全局前置守卫引起死循环的原因与解决方法

我们经常会用到全局前置守卫,如判断用户有没有登陆过,如果登陆过就直接跳到目的页面,如果没有登陆过,就跳转到登陆页。先看官网对全局前置守卫的介绍

点击更多...

内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!