ลูปสามารถดำเนินการบล็อกของโค้ดได้ ตราบใดที่เงื่อนไขที่ระบุเป็นจริง
ขณะ วนซ้ำ While วนซ้ำผ่านบล็อกของโค้ดตราบเท่าที่เงื่อนไขที่ระบุเป็นจริง
while (condition) {
// code block to be executed
}ในตัวอย่างต่อไปนี้ โค้ดในลูปจะทำงานซ้ำแล้วซ้ำเล่าตราบใดที่ ตัวแปร (i) น้อยกว่า 10:
while (i < 10) {
text += "The number is " + i;
i++;
}
ลองด้วยตัวคุณเอง →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript While Loop</h2>
<p id="demo"></p>
<script>
let text = "";
let i = 0;
while (i < 10) {
text += "<br>The number is " + i;
i++;
}
document.getElementById("demo").innerHTML = text;
</script>
</body>
</html>
หากคุณลืมเพิ่มตัวแปรที่ใช้ในเงื่อนไข การวนซ้ำจะไม่สิ้นสุด นี่จะทำให้เบราว์เซอร์ของคุณเสียหาย
do while วนซ้ำลูป do while เป็นรูปแบบหนึ่งของลูป while วงนี้จะ ดำเนินการบล็อคโค้ดหนึ่งครั้ง ก่อนที่จะตรวจสอบว่าเงื่อนไขเป็นจริงหรือไม่ ทำซ้ำลูปตราบใดที่เงื่อนไขเป็นจริง
do {
// code block to be executed
}
while (condition);ตัวอย่างด้านล่างใช้ลูป do while จะมีการวนซ้ำอยู่เสมอ ดำเนินการอย่างน้อยหนึ่งครั้งแม้ว่าเงื่อนไขจะเป็นเท็จเนื่องจากบล็อกโค้ด จะถูกดำเนินการก่อนที่จะทดสอบเงื่อนไข:
do {
text += "The number is " + i;
i++;
}
while (i < 10);ลองด้วยตัวคุณเอง →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Do While Loop</h2>
<p id="demo"></p>
<script>
let text = ""
let i = 0;
do {
text += "<br>The number is " + i;
i++;
}
while (i < 10);
document.getElementById("demo").innerHTML = text;
</script>
</body>
</html>
อย่าลืมเพิ่มตัวแปรที่ใช้ในเงื่อนไขด้วย มิฉะนั้น ห่วงจะไม่มีวันสิ้นสุด!
for และ whileหากคุณได้อ่านบทที่แล้วเกี่ยวกับ for loop คุณจะพบว่า while loop เป็นเช่นนั้น เหมือนกับ a for loop มาก โดยละเว้นคำสั่ง 1 และคำสั่ง 3
การวนซ้ำในตัวอย่างนี้ใช้การวนซ้ำ for เพื่อรวบรวมรถ ชื่อจากอาร์เรย์รถยนต์:
const cars = ["BMW", "Volvo", "Saab", "Ford"];
let i = 0;
let text = "";
for (;cars[i];) {
text += cars[i];
i++;
}ลองด้วยตัวคุณเอง →
<!DOCTYPE html>
<html>
<body>
<p id="demo"></p>
<script>
const cars = ["BMW", "Volvo", "Saab", "Ford"];
let i = 0;
let text = "";
for (;cars[i];) {
text += cars[i] + "<br>";
i++;
}
document.getElementById("demo").innerHTML = text;
</script>
</body>
</html>
การวนซ้ำในตัวอย่างนี้ใช้การวนซ้ำ while เพื่อรวบรวม ชื่อรถจากอาร์เรย์รถยนต์:
const cars = ["BMW", "Volvo", "Saab", "Ford"];
let i = 0;
let text = "";
while (cars[i]) {
text += cars[i];
i++;
}ลองด้วยตัวคุณเอง →
<!DOCTYPE html>
<html>
<body>
<p id="demo"></p>
<script>
const cars = ["BMW", "Volvo", "Saab", "Ford"];
let i = 0;
let text = "";
while (cars[i]) {
text += cars[i] + "<br>";
i++;
}
document.getElementById("demo").innerHTML = text;
</script>
</body>
</html>