大家好，我是前端進(jìn)階者。我們都知道，有了循環(huán)，就可以多次執(zhí)行一段代碼。

一、JavaScript 循環(huán)

循環(huán)是方便的，如果你想重復(fù)地運(yùn)行同一個(gè)代碼，每次使用不同的值。

通常情況下，這是與數(shù)組一起工作:

 
 
 
 

  
  
  
  
text += cars[0] + "
";
  
  
  
  
text += cars[1] + "
";
  
  
  
  
text += cars[2] + "
";
  
  
  
  
text += cars[3] + "
";
  
  
  
  
text += cars[4] + "
";
  
  
  
  
text += cars[5] + "
";
  
  
  
  

  
  
  
  
可以寫(xiě)成這樣:
  
  
  
  

  
  
  
  
for (i = 0; i < cars.length; i++) {
  
  
  
  
    text += cars[i] + "
";
  
  
  
  
}
 
 
 
 

例：

 
 
 
 

  
  
  
  

  
  
  
  

  
  
  
  
    
  
  
  
  
        
  
  
  
  
        
  
  
  
  
    
  
  
  
  
    
  
  
  
  

  
  
  
  
        
JavaScript 循環(huán)
  
  
  
  

  
  
  
  
        

  
  
  
  

  
  
  
  
        
  
  
  
  

  
  
  
  
    
  
  
  
  

 
 
 
 

二、不同種類的循環(huán)

JavaScript 支持不同類型的循環(huán):

for - 多次循環(huán)一段代碼。

for/in - 通過(guò)對(duì)象的屬性循環(huán)。

三、For 循環(huán)

for循環(huán)通常是你想創(chuàng)建循環(huán)時(shí)使用的工具。

語(yǔ)法:

 
 
 
 

  
  
  
  
for (statement 1; statement 2; statement 3) {
  
  
  
  
   code block to be executed
  
  
  
  
}
 
 
 
 

語(yǔ)句1：循環(huán)(代碼塊)開(kāi)始之前執(zhí)行。

語(yǔ)句2：定義了運(yùn)行循環(huán)的條件(代碼塊)。

語(yǔ)句3：循環(huán)(代碼塊)被執(zhí)行后每次執(zhí)行。

 
 
 
 

  
  
  
  
for (i = 0; i < 5; i++) {
  
  
  
  
   text += "The number is " + i + "
";
  
  
  
  
}
 
 
 
 

完整代碼:

 
 
 
 

  
  
  
  

  
  
  
  

  
  
  
  

  
  
  
  

  
  
  
  

  
  
  
  

  
  
  
  

  
  
  
  

  
  
  
  
JavaScript Loops
  
  
  
  

  
  
  
  

  
  
  
  

  
  
  
  

  
  
  
  

  
  
  
  

  
  
  
  

 
 
 
 

語(yǔ)句1在循環(huán)開(kāi)始前設(shè)置變量 (var i = 0)，語(yǔ)句2定義了循環(huán)運(yùn)行的條件 (i 必須小于 5)，語(yǔ)句3增加值(i++) 每次循環(huán)中的代碼塊都已被執(zhí)行。

1. 語(yǔ)句 1

通常，您將使用語(yǔ)句1初始化循環(huán)中使用的變量 (i = 0)。語(yǔ)句1是可選的，可以在語(yǔ)句1中初始化多個(gè)值(逗號(hào)分隔)。

 
 
 
 

  
  
  
  
for (i = 0; i < 5; i++) {
  
  
  
  
   text += "The number is " + i + "
";
  
  
  
  
}
 
 
 
 

可以省略語(yǔ)句1(如在循環(huán)開(kāi)始之前設(shè)置值)。

2. 語(yǔ)句 2

經(jīng)常使用語(yǔ)句2來(lái)判斷初始變量的條件。

這是情況并非總是如此，JavaScript不在乎。語(yǔ)句2也是可選的.如果語(yǔ)句2返回true，則循環(huán)將重新啟動(dòng)，如果返回false，則循環(huán)將結(jié)束。

如果省略語(yǔ)句2，則必須在循環(huán)中提供一個(gè)中斷。否則循環(huán)永遠(yuǎn)不會(huì)結(jié)束。這將使你的瀏覽器崩潰。

3. 語(yǔ)句 3

經(jīng)常語(yǔ)句3增加初始變量的值.這是情況并非總是如此，JavaScript不在乎，并聲明3是可選的。

聲明3可以做任何事情，如負(fù)增量(i--)，正增量(i = i + 15)，或任何其他。

語(yǔ)句3也可以省略(例如當(dāng)你在循環(huán)中增加你的值)。

四、For/In 循環(huán)

JavaScript for/in 語(yǔ)句遍歷對(duì)象的屬性。

 
 
 
 

  
  
  
  

  
  
  
  

  
  
  
  
  
  
  
  
  
    
  
  
  
  
    
  
  
  
  
  
  
  
  
  
  
  
  
  
  

  
  
  
  
    
JavaScript 循環(huán)
  
  
  
  

  
  
  
  
    
for/in 語(yǔ)句通過(guò)對(duì)象的屬性循環(huán).
  
  
  
  

  
  
  
  
    

  
  
  
  

  
  
  
  
    
  
  
  
  

  
  
  
  
  
  
  
  
  

 
 
 
 

for/in 語(yǔ)句通過(guò)對(duì)象的屬性循環(huán).

五、總結(jié)

本文基于JavaScript 基礎(chǔ)。介循環(huán)中for循環(huán)在實(shí)際項(xiàng)目的應(yīng)用。通過(guò) 循環(huán)語(yǔ)法講解，文字的說(shuō)明。不同種類的循環(huán)能夠讓讀者更好的去理解for 循環(huán)。

希望能夠幫助讀者更好的學(xué)習(xí)。

本文轉(zhuǎn)載自微信公眾號(hào)「前端進(jìn)階學(xué)習(xí)交流」，可以通過(guò)以下二維碼關(guān)注。轉(zhuǎn)載本文請(qǐng)聯(lián)系前端進(jìn)階學(xué)習(xí)交流公眾號(hào)。

當(dāng)前題目：一篇文章帶你了解JavaScriptfor循環(huán)
鏈接地址：http://www.dlmjj.cn/article/dpiggcj.html