JavaScript循环结构

引入:操场一圈是400米,在运动会的时候,2000米的跑步比赛,我们需要绕操场跑5圈,如下图:

示意图

这就是

一个循环,那么,在这个过程中,其实我们动作只是跑一圈,剩下的过程只是在重复。从计算机的角度来想,我们可不可以设定一个程序,让他自动跑5圈呢?可以的,用咱们今天要学习的循环结构。循环结构的意义就是让代码重复执行。

一、while循环结构

语法:

while(条件语句){

    条件成立执行的代码

例:对女朋友说5句我爱你

// 那么既然是循环,咱们需要设定几个条件,首先是从哪开始,每完成一次要进行计数,完成多少次停止。

vari=1;

while(i<=10){

document.write("我爱你!");

i++;

}

while循环结构的具体流程:

while循环的运行流程



while循环需要我们在循环外就将变量声名好,在执行代码的过程中,一定要让变量进行变化,否则这个循环就会无休止的进行下去。

不会停止的循环叫做死循环,程序一直不会停止,cpu占用率越来越高,很容易造成系统崩溃。所以我们在写代码的时候一定避免写成死循环。

例:利用while循环中的变量输出数字1~5

vari=1;

while(while<=5){

document.write(i);

i++;

}

二、do while循环结构

do while 循环是while循环的变异体。循环流程相似,唯一不同的地方在于do while循环会先执行一次,不管条件是否成立,先执行一次,后面的流程和while循环一样。

三、for循环结构

语法:

for(声明变量并赋初始值;条件表达式;每重复一次后变量的变化规律){

   重复执行的代码块

}

# 在语法中的声明变量并赋初始值,就是从哪里开始重复;条件表达式可以限定重复在什么时候停止(当条件不成立的时候);通过每次重复变量的变化和条件表达式可以知道要重复多少次

例:输出10句“我爱你”

for(vari=1;i<=10;i++){

    document.write("我爱你");

}

循环执行过程分析:

首先i=1;然后进行条件判断i<=10;条件成立,所以运行了大括号中的代码-----第一次执行接下来i++;然后i=2;再进行条件判断i<=10;条件成立,所以又运行了大括号中的代码------第二次执行i++;i=3;条件判断i<=10;条件成立,再次运行------第三次执行i++;i=4;条件判断i<=10;条件成立,再次运行------第四次运行。。。

vararr=[10,20,30,40,50];

varsum=0;

for(variinarr) {

    sum+=arr[i];

}

alert(sum);

for循环中的初始值和变化可以不放在小括号中

vari=1;

for(;i<=5;){

    document.write(i);

    i++;

}

执行流程是一样的,只是写法不一样。

在循环中,变量i的变化规律可以不是递增,也可以递减,也可以不是递增1。。。总而言之,变量i的变化规律可以自定义。

例:求出1~10之间所有单数的和。

varsum=0;

for(vari=1;i<=10;i+=2){

    sum+=i;

}

alert(sum);// 25

for循环的运行流程


循环中的跳转关键字

在循环有两个关键字可以改变循环执行的流程。

continue关键字,可以跳过当前这次的循环,直接进行下一次的循环。

for(vari=1;i<=5;i++){

    if(i==3){

        continue;// 当i=3的时候,直接进行下一次的循环

    }

    document.write(i);

}

// 最后结果是1245

break关键字,可终止循环,直接让整个循环结束运行。

for(vari=1;i<=5;i++){

    if(i==3){

        break;// 当i=3的时候,直接结束整个循环的运行

    }

    document.write(i);

}

// 最后结果是12

运行流程如下图所示:

案例:

入职薪水10K,每年涨幅5%,50年后工资多少?

打印100以内 7的倍数

打印100以内的奇数

循环的嵌套

让一段重复执行代码重复执行,也就是设定一个大程序,让多个人跑5圈。

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

    for(var j=1;j<=5;j++){

        document.write("第" + i + "个人跑第" + j + "圈<br>");

    }

}

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 216,372评论 6 498
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 92,368评论 3 392
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 162,415评论 0 353
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 58,157评论 1 292
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 67,171评论 6 388
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 51,125评论 1 297
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 40,028评论 3 417
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 38,887评论 0 274
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 45,310评论 1 310
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,533评论 2 332
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,690评论 1 348
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 35,411评论 5 343
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 41,004评论 3 325
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,659评论 0 22
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,812评论 1 268
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 47,693评论 2 368
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 44,577评论 2 353

推荐阅读更多精彩内容