首頁 > web前端 > js教程 > JavaScript 循環綜合指南

JavaScript 循環綜合指南

Mary-Kate Olsen
發布: 2024-12-24 22:36:16
原創
900 人瀏覽過

Comprehensive Guide to Loops in JavaScript

### JavaScript 中的循環

這是 JavaScript 循環的綜合指南和範例:


### **1。 For 循環**
當您知道需要執行的確切迭代次數時,for 迴圈是理想的選擇。

#### **文法:**

for (initialization; condition; increment/decrement) {
  // Code to execute
}
登入後複製
登入後複製

#### **範例:**

for (let i = 1; i <= 5; i++) {
  console.log(`Iteration: ${i}`);
}
登入後複製
登入後複製

***說明:*

  • let i = 1 初始化循環變數 i.
  • i
  • i 在每次迴圈執行後遞增 i。

### **2。 While 迴圈**
當迭代次數未預先確定且取決於條件時,請使用 while 迴圈。

#### **文法:**

while (condition) {
  // Code to execute
}
登入後複製
登入後複製

#### **範例:**

let count = 0;
while (count < 5) {
  console.log(`Count is: ${count}`);
  count++;
}
登入後複製
登入後複製

***說明:*

  • 只要 count 迴圈就會繼續。 5 是真的。
  • 在迴圈內部,count 的值在每次迭代中遞增。

### **3。 Do-While 迴圈**
do-while 迴圈確保程式碼區塊至少執行一次,即使條件為 false。

#### **文法:**

do {
  // Code to execute
} while (condition);
登入後複製
登入後複製

#### **範例:**

let number = 0;
do {
  console.log(`Number is: ${number}`);
  number++;
} while (number < 3);
登入後複製
登入後複製

***說明:*

  • 循環體先運行,印出數字。
  • 條件數

### **4。 For-In 迴圈**
for-in 迴圈用於迭代物件的屬性。

#### **文法:**

for (key in object) {
  // Code to execute
}
登入後複製
登入後複製

#### **範例:**

const person = { name: "John", age: 30, city: "New York" };
for (let key in person) {
  console.log(`${key}: ${person[key]}`);
}
登入後複製
登入後複製

***輸出:*

name: John
age: 30
city: New York
登入後複製

***說明:*

  • key 保存屬性名稱。
  • person[key] 存取對應的值。

### **5。 For-Of 循環**
for-of 連結用於迭代可迭代對象,例如陣列、字串、映射或集合。

#### **文法:**

for (variable of iterable) {
  // Code to execute
}
登入後複製

#### **範例:**

const fruits = ["Apple", "Banana", "Cherry"];
for (let fruit of fruits) {
  console.log(fruit);
}
登入後複製

***輸出:*

Apple
Banana
Cherry
登入後複製

***說明:*

  • Fruit 依序取得陣列的每個元素。

### **6。跳出循環**
使用break語句提前退出迴圈。

#### **範例:**

for (let i = 0; i < 10; i++) {
  if (i === 5) break;
  console.log(i);
}
登入後複製

***輸出:*

for (initialization; condition; increment/decrement) {
  // Code to execute
}
登入後複製
登入後複製

### **7。跳過迭代**
使用 continue 語句跳過目前迭代。

#### **範例:**

for (let i = 1; i <= 5; i++) {
  console.log(`Iteration: ${i}`);
}
登入後複製
登入後複製

***輸出:*

while (condition) {
  // Code to execute
}
登入後複製
登入後複製

### **8。巢狀循環**
循環可以相互嵌套以進行多維迭代。

範例

let count = 0;
while (count < 5) {
  console.log(`Count is: ${count}`);
  count++;
}
登入後複製
登入後複製

***輸出:*

do {
  // Code to execute
} while (condition);
登入後複製
登入後複製

### **9。無限循環**
小心那些永遠不會計算為 false 的條件的循環。

#### **範例:**

let number = 0;
do {
  console.log(`Number is: ${number}`);
  number++;
} while (number < 3);
登入後複製
登入後複製

注意:避免此類循環,除非有中斷機制。


### **10。循環數組**
for 和 for-of 記憶環通常與陣列一起使用。

#### **範例:**

for (key in object) {
  // Code to execute
}
登入後複製
登入後複製

### **11。循環字串**
for-of 記憶體對於迭代字串的字元也很有幫助。

範例

const person = { name: "John", age: 30, city: "New York" };
for (let key in person) {
  console.log(`${key}: ${person[key]}`);
}
登入後複製
登入後複製

透過有效地理解和應用這些循環類型,您可以有效地處理 JavaScript 中的重複任務和資料結構。如果您需要澄清任何特定類型,請告訴我!

嗨,我是 Abhay Singh Kathayat!
我是一名全端開發人員,擁有前端和後端技術的專業知識。我使用各種程式語言和框架來建立高效、可擴展且用戶友好的應用程式。
請隨時透過我的商務電子郵件與我聯繫:kaashshorts28@gmail.com。

以上是JavaScript 循環綜合指南的詳細內容。更多資訊請關注PHP中文網其他相關文章!

來源:dev.to
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
作者最新文章
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板