จากการศึกษาลูปครั้งก่อน เรารู้ว่าตามค่าเริ่มต้นแล้ว ลูปจะออกโดยอัตโนมัติเมื่อผลลัพธ์ของนิพจน์เป็นเท็จ มิฉะนั้น ลูปก็จะดำเนินต่อไป ในบางกรณี เราไม่จำเป็นต้องรอให้ลูปออกโดยอัตโนมัติ แต่สามารถออกจากลูปได้ JavaScript จัดเตรียมสองคำสั่ง แบ่งและดำเนินการต่อ เพื่อออกจากลูปและออกจากลูปปัจจุบัน
1. คำสั่ง Continue
คำสั่ง Continue ใช้เพื่อข้ามลูปนี้และดำเนินการลูปถัดไป เมื่อพบคำสั่ง Continue โปรแกรมจะทดสอบนิพจน์เงื่อนไขอีกครั้งทันที หากผลลัพธ์ของนิพจน์เป็นจริง การวนซ้ำถัดไปจะเริ่มต้นขึ้น หากผลลัพธ์ของนิพจน์เป็นเท็จ การวนซ้ำจะออก
[ตัวอย่างที่ 1] ใช้คำสั่ง Continue เพื่อข้ามออกจากลูป:
<script type="text/javascript"> สำหรับ (var i = 1; i < 10; i++) { ถ้า(ฉัน % 2 != 0) { ดำเนินการต่อ; - console.log(i); - </script>
การวิเคราะห์:
for (var i = 0; i < 10; i++){}
สามารถวนซ้ำเพื่อรับตัวเลขทั้งหมดระหว่าง 1 ถึง 10
คำสั่ง if(i % 2 != 0)
ใช้เพื่อกำหนด ค่าของ i สามารถหารด้วย 2 ได้หรือไม่ ถ้าไม่ ค่าใน ()
เป็นจริง และคำสั่ง continue;
จะถูกดำเนินการ
ในส่วนเนื้อหาของลูป ให้ใช้คำสั่ง if(i % 2 == 0)
เพื่อตัดสิน หากค่าของ i
สามารถหารได้เท่าๆ กันด้วย 2 ให้ใช้ " console.log(i);
" เพื่อส่งออกค่า ของ i
ไม่สามารถหารเท่ากันด้วย 2 ได้ เรียกใช้คำสั่ง continue;
ไป กระโดดออกจากลูปนี้ (ไม่มีเอาต์พุต) และดำเนินการลูปถัดไป
ผลลัพธ์ที่ได้:
2. คำสั่ง Break
คำสั่ง break ใช้เพื่อข้ามออกจากโครงสร้างไวยากรณ์ปัจจุบัน มันสามารถยุติโค้ดของเนื้อหาลูปและข้ามออกจากลูปปัจจุบันได้ทันที และรันโค้ดหลังลูป (ถ้ามี)
ข้อแตกต่างระหว่างคำสั่ง break และ Continue คือ คำสั่ง Continue จะสิ้นสุดเฉพาะลูปปัจจุบัน ในขณะที่คำสั่ง Break จะยุติการดำเนินการของทั้งลูป
หากเรายังคงใช้โค้ดในตัวอย่างที่ 1 ข้างต้นและแทนที่ continue;
ด้วย break;
ผลลัพธ์ที่ได้จะเป็นเช่นไร?
<script type="text/javascript"> สำหรับ (var i = 1; i < 10; i++) { ถ้า(ฉัน % 2 != 0) { หยุดพัก; - console.log(i); - </script>
คำตอบคือ: output none ไม่มีอะไร ทำไมสิ่งนี้ถึงเกิดขึ้น? มาวิเคราะห์กันดีกว่า:
ที่จุดเริ่มต้นของ forx loop i=1
, 1 น้อยกว่า 10 หรือไม่? แน่นอนว่าคำสั่ง if(i % 2 != 0)
ในส่วนเนื้อหาของลูปจะเริ่มดำเนินการ
แล้ว 1 จะสามารถหาร 2 ได้หรือไม่ แน่นอนว่ามันทำไม่ได้ ดังนั้นหากค่าใน ()
เป็นจริง คำสั่ง " break;
" ใน if จะถูกดำเนินการ โดยกระโดดออกจากลูปทั้งหมดโดยตรง และไม่มีโอกาสที่จะรันคำสั่ง " console.log(i);
" คำแถลง.
3. Nested For Loops
เป็นที่น่าสังเกตว่าทั้ง break
และ continue
จะใช้ได้เฉพาะกับลูปปัจจุบันเท่านั้น หากเรามีลูปซ้อนเราต้องระวัง ลองมาดูตัวอย่างต่อไปนี้:
for (let i = 0; i < 5; i++) { ถ้า (i % 2 == 0) ดำเนินการต่อ; สำหรับ (ให้ j = 0; j <5; j++) { ถ้า (j == 2) แตก; console.log(`i = ${i}, j = ${j}`); - -
ที่นี่เรามีสองลูป แต่ละลูปดำเนินการ 5 ครั้ง (0~4) เมื่อ i เป็นเลขคู่ ลูปด้านนอกจะข้ามลูปปัจจุบันและดำเนินการลูปถัดไป กล่าวคือ เฉพาะเมื่อฉันอายุ 1 หรือ 3 เท่านั้น วงในจะถูกดำเนินการ
วงในจะสิ้นสุดตราบใดที่ค่าของ j เท่ากับ 2 ดังนั้น j จึงมีเพียง 0 และ 1 เท่านั้น
ผลลัพธ์สุดท้ายจะเป็นดังนี้:
4. แท็ก JavaScript
เริ่มต้นจาก JavaScript 1.2 แท็กสามารถใช้ร่วมกับตัวแบ่งและควบคุมการทำงานของโปรแกรมได้แม่นยำยิ่งขึ้นต่อไป
แท็กใน JavaScript แตกต่างจากแท็กใน HTML แท็กใน JavaScript เป็นตัวระบุ (คล้ายกับชื่อตัวแปร) ตามด้วยโคลอน: แท็ก JavaScript สามารถประกาศก่อนคำสั่งหรือบล็อคโค้ดใดๆ และใช้ร่วมกับตัวแบ่งหรือดำเนินการต่อเพื่อข้ามออกจากลูปเฉพาะ ตัวอย่างเช่น เมื่อหลายลูปซ้อนกัน การใช้ตัวแบ่งเพียงอย่างเดียวก็สามารถข้ามออกจากลูปปัจจุบันได้ ไม่ใช่ลูปด้านนอก หากคุณใช้ตัวแบ่งพร้อมป้ายกำกับ คุณสามารถแยกลูปหลายระดับพร้อมกันได้
โค้ดตัวอย่างจะเป็นดังนี้:
<script type="text/javascript"> document.write("เริ่มวนซ้ำ!<br /> "); outerloop: //กำหนดป้ายกำกับสำหรับ (var i = 0; i < 5; i++) { document.write("วงนอก: " + i + "<br />"); innerloop: // กำหนดป้ายกำกับสำหรับ (var j = 0; j < 5; j++) { ถ้า (j > 3) พัง // แยกออกจากวงในถ้า (i == 2) แยกออกจากข้อความภายในถ้า (i == 4) แยกออกจาก document.write วงนอก ( "วงใน: " + j + " <br />"); - - document.write("สิ้นสุดวง!<br /> "); </สคริปต์>
หมายเหตุ: ไม่สามารถขึ้นบรรทัดใหม่ระหว่างตัวแบ่งหรือดำเนินการต่อกับป้ายกำกับได้ นอกจากนี้ จะไม่มีโค้ดอื่นปรากฏระหว่างชื่อป้ายกำกับและการวนซ้ำที่เกี่ยวข้อง
[การเรียนรู้ที่แนะนำ: บทช่วยสอนขั้นสูงของ JavaScript]
ด้านบนคือเนื้อหาโดยละเอียดของการเรียนรู้ JS loop: ทำลายและดำเนินการต่อคำสั่งเพื่อออกจากลูป สำหรับข้อมูลเพิ่มเติม โปรดใส่ใจกับบทความอื่น ๆ ที่เกี่ยวข้องบนเว็บไซต์ภาษาจีน PHP!