JavaScript 程序循環(huán)結(jié)構(gòu)詳解
選擇結(jié)構(gòu)
單分支的if結(jié)構(gòu)
if(條件){
條件滿足后執(zhí)行的代碼
}
如果大括號中只有一條語句,此時可以省略大括號,但是強(qiáng)烈不建議這樣寫
if(條件)
console.log('點點點')
二分支if結(jié)構(gòu)語句
if (條件){
條件滿足后執(zhí)行的代碼
}
else{
條件不滿足后執(zhí)行的代碼
}
多分支if結(jié)構(gòu)語句
if(條件1){
代碼1
}
else if(條件2){
代碼2
}
......
else{
以上條件都不滿足執(zhí)行的代碼
}
switch結(jié)構(gòu)
var today=1
switch(today){
case 1:
console.log('工作日')
break
case 2:
console.log('工作日')
break
case 3:
case 4:
case 5:
console.log('工作日')
break
default
console.log('休息日')
break
switch和if得區(qū)別
- switch 只能進(jìn)行等值得判斷if
- 沒有限制適合某個連續(xù)區(qū)間得判斷
循環(huán)結(jié)構(gòu)
重復(fù)性的執(zhí)行某個操作就是循環(huán)
while
//循環(huán)10次
var i=1
while(i<=10){
console.log('111111')
i++
}
//案例:計算100以內(nèi)整數(shù)之和
var i=1
var sum = 0
while(i<=100){
sum+=i
i++
}
案例
在頁面輸出[1,200]之間所有能被7整除,但不能被4整除的所有整數(shù),并統(tǒng)計個數(shù),同時要求輸出每行顯示5個
var i=1
var count = 0
while(i<=200){
if(i%7==0 && i%4!=0){
document.write(i+" ")
count++;//統(tǒng)計個數(shù)
// 判斷每輸出5個換一行
if(count%5==0){
document..write('<br>');
}
}
i++;
document.write('<br>共計: '+count+'個')
do … while
先執(zhí)行代碼,再判斷條件
var i=1;
do{
console.log('好好學(xué)習(xí),天天向上!')
i++;
}while(i<=10)
#案例
#計算1-50之間得倍數(shù)
<script type="text/javascript">
var i=1;
var sum=0;
do{
if(i%6==0){
sum+=i
}
i++;
}while(i<=50)
console.log(sum)
</script>
#案例
# 循環(huán)提示用戶輸入5個數(shù),按q結(jié)束,然后輸出其中最大值和最小值
#先提示用戶輸入一次,然后將該數(shù)字作為最大值和最小值
var num=Number(prompt('請輸入一個征屬(按q結(jié)束):'))
var max=num;
var min=num;
var flag=true //標(biāo)識是否繼續(xù)循環(huán)
var i = 1;
do{
var num=Number(promot('請輸入一個整數(shù)!'))
#判斷用戶是否輸入q
if(num=='q'){
flag=false //如果輸入q則將flag改為false,表示停止循環(huán)
}else{
num=Number(num)
if(num>max){
max=num;
}
if (num<min){
min=num
}
}while(flag)
console.log(max)
console.log(min)
for 循環(huán)
語法
for(初始化:條件:迭代){
代碼塊
}
循環(huán)開始時先執(zhí)行初始化部分,而且初始化部分只執(zhí)行一次
初始化執(zhí)行完之后就去判斷條件是否成立,如果成立則執(zhí)行代碼塊,然后執(zhí)行迭代部分
for … in …
對集合數(shù)據(jù)進(jìn)行遍歷
循環(huán)遍歷是遍歷到的數(shù)據(jù)在集合中的索引順序(從0開始),而非數(shù)據(jù)本身
<script type="text/javascript">
var str = 'abc'
for(var index in str){
console.log(index,str[index])
}
</script>

for …of…
對集合數(shù)據(jù)進(jìn)行迭代遍歷
這是直接拿到值
<script type="text/javascript">
var str = 'abc'
for(var index of str){
console.log(index)
}
</script>

小結(jié)
- 循環(huán)次數(shù)確定時一般使用for
- 循環(huán)次數(shù)不確定時一般使用while和do…while
- 對集合進(jìn)行遍歷時使用 for…in和for…of
終止循環(huán)
break
break跳出整個循環(huán),終止循環(huán)的執(zhí)行
案例
//當(dāng)1-20之間整數(shù)相加,當(dāng)累加值大于66時停止相加,輸出當(dāng)前整數(shù)和累加值
var sum=0
for(var i=1;i<=20;i++){
sum+=1
if(sum>66){
break
}
}
continue
跳出本次循環(huán),執(zhí)行下一次循環(huán),本次循環(huán)尚未執(zhí)行完
//計算1-10之間所有偶數(shù)和
var sum=0;
for(var i=1;i<=10;i++){
if(i%2!=0){
continue
}
sum+=i
}
二層循環(huán)
一個循環(huán)嵌套著另一個循環(huán),成為二重循環(huán),各種循環(huán)可以相互嵌套
外層循環(huán)變量變化一次,內(nèi)層循環(huán)執(zhí)行一邊
//案例
//某次程序大賽,共有三個班級參加,每個班級4名學(xué)生,輸入各班級每個學(xué)生成績,然后計算各班級平均分
for(var i=1;i<=3;i++){
alert('請輸入第'+i+'個班級學(xué)生信息---')
//內(nèi)層循環(huán)控制班級學(xué)生數(shù)量
var sum=0
for(var j=1;j<=4;j++){
var score=Number(prompt('請輸入第'+j+'個學(xué)生成績:'))
sum+=score;
}
console.log('第'+i+'個班級平均分為:'+sum/4)
}
<script type="text/javascript">
for(var i=1;i<=9;i++){
for(var j=1;j<=i;j++){
document.write(j+'*'+i+'='+i*j+'  ')
}
document.write('<br>')
}
</script>

總結(jié)
本篇文章就到這里了,希望能夠給你帶來幫助,也希望您能夠多多關(guān)注腳本之家的更多內(nèi)容!
相關(guān)文章
小程序開發(fā)中如何使用async-await并封裝公共異步請求的方法
在平常的項目開發(fā)中肯定會遇到同步異步執(zhí)行的問題,這篇文章主要介紹了小程序開發(fā)中如何使用async-await并封裝公共異步請求的方法,具有一定的參考價值,感興趣的小伙伴們可以參考一下2019-01-01
javascript+css實現(xiàn)單擊顏色褪去效果
javascript+css實現(xiàn)單擊顏色褪去效果...2007-08-08
利用JQuery和JS實現(xiàn)奇偶行背景顏色自定義效果
本文將詳細(xì)介紹利用JQuery和JS實現(xiàn)奇偶行背景顏色自定義效果,需要的朋友可以參考下2012-11-11
JSON在Javascript中的使用(eval和JSON.parse的區(qū)別)詳細(xì)解析
這篇文章主要介紹了JSON在Javascript中的使用以及eval和JSON.parse的區(qū)別詳細(xì)解析,本文對eval()和JSON.parse()的區(qū)別介紹的非常詳細(xì),需要的朋友可以參考下2017-09-09
基于element-ui組件手動實現(xiàn)單選和上傳功能
在用戶使用過程中提出一鍵導(dǎo)入的功能,需求如下:點擊導(dǎo)入按鈕顯示提示框,然后是單選框以及上傳按鈕。這篇文章主要介紹了基于element-ui組件手動實現(xiàn)單選和上傳功能,需要的朋友可以參考下2018-12-12
JS實現(xiàn)點擊上移下移LI行數(shù)據(jù)的方法
這篇文章主要介紹了JS實現(xiàn)點擊上移下移LI行數(shù)據(jù)的方法,涉及javascript針對LI列表動態(tài)排序的相關(guān)實現(xiàn)技巧,具有一定參考借鑒價值,需要的朋友可以參考下2015-08-08

