วงจรคือ คำแนะนำการควบคุมซึ่งช่วยให้คุณสามารถเรียกใช้โค้ดโปรแกรมซ้ำได้ตามจำนวนครั้งที่กำหนด การดำเนินการตามคำสั่งแต่ละรายการในส่วนเนื้อหาของลูปเรียกว่าการวนซ้ำ

ในขณะที่วนซ้ำ

ในขณะที่ไวยากรณ์วนซ้ำ:

นิพจน์ในวงเล็บเรียกว่าเงื่อนไขการดำเนินการแบบวนซ้ำ หรือเรียกสั้นๆ ว่าเงื่อนไข ขั้นแรก ให้คำนวณค่าของนิพจน์ ค่าผลลัพธ์จะถูกแปลงเป็นประเภทบูลีนโดยปริยายหากจำเป็น หากผลลัพธ์ของการประเมินนิพจน์เป็น true คำสั่งที่อยู่ในเนื้อความของลูปจะถูกดำเนินการ จากนั้นการควบคุมจะถูกถ่ายโอนไปยังจุดเริ่มต้นของลูป และเงื่อนไขจะถูกประเมินอีกครั้ง หากผลการประเมินนิพจน์คือ ค่าเท็จล่ามจะยุติการวนซ้ำและดำเนินการตามคำสั่งต่อไปตามการวนซ้ำ ดังนั้นล่ามจะรันโค้ดที่อยู่ในเนื้อหาของลูปซ้ำแล้วซ้ำเล่าตราบใดที่เงื่อนไขยังคงเป็นจริง:

วาร์ ฉัน = 0; ในขณะที่ (i< 3) { // Выполнять код, пока значение переменной i меньше 3 alert("i: " + i); i++; // Увеличиваем значение переменной i }

ทำในขณะที่วนซ้ำ

ไวยากรณ์ลูป Do- While:

การวนซ้ำแบบ do- While นั้นคล้ายคลึงกับการวนซ้ำแบบ while ยกเว้นว่าเงื่อนไขของลูปจะถูกตรวจสอบหลังจากการวนซ้ำครั้งแรกแทนที่จะเป็นก่อนหน้า และการวนซ้ำจะลงท้ายด้วยเครื่องหมายอัฒภาค เนื่องจากเงื่อนไขได้รับการตรวจสอบหลังจากการวนซ้ำ โค้ดในส่วนเนื้อหาของลูป do- While จะถูกดำเนินการอย่างน้อยหนึ่งครั้งเสมอ:

จำนวนวาร์ = 0; ทำ ( document.write(count + " "); count++; ) ในขณะที่(count< 5); Попробовать »

การวนซ้ำนี้จะมีประโยชน์เมื่อต้องดำเนินการโค้ดในส่วนเนื้อหาของลูปอย่างน้อยหนึ่งครั้ง โดยไม่คำนึงถึงเงื่อนไขการดำเนินการ

สำหรับวง

สำหรับไวยากรณ์ลูป:

for loop มีสามนิพจน์คั่นด้วยเครื่องหมายอัฒภาค นิพจน์ทั้งสามนี้มีลำดับการดำเนินการดังต่อไปนี้:

นิพจน์แรกจะได้รับการประเมินเพียงครั้งเดียวเท่านั้น - ก่อนการวนซ้ำครั้งแรก ดังนั้น โดยปกติแล้วนิพจน์แรกคือคำจำกัดความของตัวแปรที่ใช้ในเงื่อนไขการดำเนินการแบบวนซ้ำเป็นตัวนับ

นิพจน์ที่สองกำหนดเงื่อนไขในการดำเนินการวนซ้ำ มีการคำนวณก่อนการวนซ้ำแต่ละครั้งและกำหนดว่าเนื้อความของลูปจะถูกดำเนินการหรือไม่ ถ้าผลการประเมินนิพจน์เป็นจริง รหัสโปรแกรมถูกดำเนินการในเนื้อความของลูป หากคืนค่าเป็นเท็จ การวนซ้ำจะสิ้นสุดและการควบคุมจะย้ายไปยังคำสั่งถัดไปหลังจากการวนซ้ำ หากตรวจสอบเงื่อนไขเป็นครั้งแรก ปรากฎว่าเป็นเท็จ โค้ดในส่วนเนื้อความของลูปจะไม่ถูกดำเนินการแม้แต่ครั้งเดียว

หลังจากการวนซ้ำแต่ละครั้ง นิพจน์ที่สามจะถูกประเมิน โดยทั่วไปจะใช้เพื่อเปลี่ยนค่าของตัวแปรที่ใช้ในการทดสอบเงื่อนไขของลูป

ตัวอย่างสำหรับการวนซ้ำ:

สำหรับ (นับ var = 0; นับ< 5; count++) document.write(count + " "); Попробовать »

ดังที่เห็นได้จากตัวอย่าง สำหรับวงแตกต่างจากลูปอื่นๆ ตรงที่ให้คุณจัดกลุ่มโค้ดที่เกี่ยวข้องกับลูปไว้ในที่เดียว

นิพจน์ใดๆ ใน for loop อาจหายไป แต่ต้องมีเครื่องหมายอัฒภาคปรากฏ มิฉะนั้นจะมีเครื่องหมายอัฒภาคปรากฏ ข้อผิดพลาดทางไวยากรณ์- หากนิพจน์ที่สองหายไป การวนซ้ำจะทำงานตลอดไป

วาร์ ฉัน = 0; สำหรับ(;i< 4; i++) ... var i = 0; for (; i < 4;) ... for (var i = 1; /* нет условия */ ; i++) ... // Это эквивалентно следующему коду for (var i = 1; true; i++) ...

แทนที่จะระบุนิพจน์เดียว คุณสามารถระบุหลายนิพจน์ โดยคั่นด้วยตัวดำเนินการลูกน้ำ

// จะไม่ถูกดำเนินการเนื่องจากนิพจน์สุดท้ายในการตรวจสอบเงื่อนไขเป็นเท็จสำหรับ (i = 1; i< 4, false; i++) ... for (var i = 1, j = 5; i ซึ่งให้คุณเลือกได้หลายรายการ) for loop ประกาศตัวแปร i และตั้งค่าเป็น 0 นอกจากนี้ยังตรวจสอบว่า i น้อยกว่าจำนวนองค์ประกอบใน element ดำเนินการคำสั่ง if และเพิ่ม i ทีละหนึ่งหลังจากที่แต่ละอันผ่านลูป

เลือกแนวเพลงบางประเภทแล้วคลิกที่ปุ่มด้านล่าง: R&B Jazz Blues New Age Classical Opera

ฟังก์ชั่น HowMany(selectObject) ( var numberSelected = 0; for (var i = 0; i< selectObject.options.length; i++) { if (selectObject.options[i].selected) { numberSelected++; } } return numberSelected; } var btn = document.getElementById("btn"); btn.addEventListener("click", function(){ alert("Выбрано элементов: " + howMany(document.selectForm.musicTypes)) });

ทำ...ในขณะที่วนซ้ำ

การวนซ้ำ do... While จะวนซ้ำตราบใดที่เงื่อนไขที่กำหนดเป็นจริง คำสั่ง do... while มีลักษณะดังนี้:

ทำนิพจน์ while(condition);

นิพจน์จะถูกดำเนินการตราบเท่าที่เงื่อนไขเป็นจริง หากต้องการใช้หลายนิพจน์ ให้ใช้บล็อกนิพจน์ ( ... ) เพื่อจัดกลุ่ม หากเงื่อนไขเป็นจริง นิพจน์จะถูกดำเนินการอีกครั้ง เมื่อสิ้นสุดการส่งแต่ละครั้ง จะมีการตรวจสอบเงื่อนไข หากเงื่อนไขเป็นเท็จ การดำเนินการจะถูกระงับ และการควบคุมจะถูกถ่ายโอนไปยังนิพจน์หลังจาก do... While

ตัวอย่าง

ในตัวอย่างต่อไปนี้ do loop จะถูกดำเนินการอย่างน้อย 1 ครั้งและทำงานอีกครั้งตราบใดที่ i น้อยกว่า 5

ทำ ( i += 1; console.log(i); ) ในขณะที่ (i< 5);

ในขณะที่วนซ้ำ

while loop ดำเนินการนิพจน์ตราบเท่าที่เงื่อนไขเป็นจริง ดูเหมือนว่านี้:

ในขณะที่ (เงื่อนไข) การแสดงออก

หากเงื่อนไขกลายเป็นเท็จ นิพจน์ในลูปจะหยุดดำเนินการและการควบคุมจะส่งผ่านไปยังนิพจน์หลังลูป

เงื่อนไขจะถูกตรวจสอบว่าเป็นจริงก่อนที่จะดำเนินการนิพจน์ในลูป หากเงื่อนไขเป็นจริง นิพจน์จะถูกดำเนินการ จากนั้นเงื่อนไขจะถูกทดสอบอีกครั้ง หากเงื่อนไขเป็นเท็จ การดำเนินการจะถูกระงับ และการควบคุมจะย้ายไปที่นิพจน์หลังจากนั้น while

หากต้องการใช้หลายนิพจน์ ให้ใช้บล็อกนิพจน์ ( ... ) เพื่อจัดกลุ่ม

ตัวอย่างที่ 1

while ต่อไปนี้จะทำงานตราบใดที่ n น้อยกว่าสาม:

วาร์ n = 0; วาร์ x = 0; ในขณะที่ (น< 3) { n++; x += n; }

ในการวนซ้ำแต่ละครั้ง การวนซ้ำจะเพิ่มขึ้น n และเพิ่มค่านั้นให้กับ x ดังนั้น x และ n จะได้ค่าต่อไปนี้:

• หลังจากผ่านครั้งแรก: n = 1 และ x = 1
• หลังจากวินาที: n = 2 และ x = 3
• หลังจากผ่านครั้งที่สาม: n = 3 และ x = 6

หลังจากผ่านครั้งที่สามแล้ว เงื่อนไข n< 3 становится ложным, поэтому цикл прерывается.

ตัวอย่างที่ 2

หลีกเลี่ยง วนซ้ำไม่รู้จบ- ตรวจสอบให้แน่ใจว่าเงื่อนไขการวนซ้ำกลายเป็นเท็จในที่สุด มิฉะนั้นวงจรจะไม่ถูกขัดจังหวะ นิพจน์ใน while ถัดไปจะทำงานตลอดไปเพราะว่า เงื่อนไขจะไม่กลายเป็นเท็จ:

ในขณะที่ (จริง) ( ​​console.log("Hello, world"); )

ฉลาก

ป้ายกำกับคือคำสั่งที่มีตัวระบุที่ช่วยให้คุณอ้างถึงตำแหน่งใดตำแหน่งหนึ่งในโปรแกรมของคุณได้ ตัวอย่างเช่น คุณสามารถใช้ป้ายกำกับเพื่อระบุลูป จากนั้นใช้คำสั่งแบ่งหรือดำเนินการต่อเพื่อระบุว่าโปรแกรมควรแยกลูปหรือดำเนินการต่อไป

ไวยากรณ์ของป้ายกำกับมีดังนี้:

ป้ายกำกับ: โอเปอเรเตอร์

ความหมาย แท็กสามารถเป็นตัวระบุ JavaScript ที่ถูกต้องใดๆ ที่ไม่ใช่ได้ คำสงวน. ผู้ดำเนินการ , สิ่งที่คุณระบุหลังป้ายกำกับสามารถเป็นนิพจน์ใดก็ได้

ตัวอย่าง

ในตัวอย่างนี้ markLoop แสดงถึงการวนซ้ำแบบ while

MarkLoop: ในขณะที่ (theMark == true) ( ​​​​doSomething(); )

หยุดพัก

ใช้คำสั่งแบ่งเพื่อแยกลูป เปลี่ยนการควบคุม หรือใช้ร่วมกับคำสั่งป้ายกำกับ

• เมื่อคุณใช้ตัวแบ่งโดยไม่มีป้ายกำกับ มันจะพัง ในขณะที่วนซ้ำ, do- while และ for หรือสลับการควบคุมไปยังนิพจน์ถัดไปทันที
• เมื่อคุณใช้ตัวแบ่งด้วยเครื่องหมาย จะเป็นการทำลายนิพจน์ที่ทำเครื่องหมายไว้เป็นพิเศษ

ไวยากรณ์ของตัวดำเนินการอาจเป็น:

หยุดพัก;

หยุดพัก ฉลาก;

รูปแบบแรกของไวยากรณ์จะแบ่งลูปทั้งหมดหรือเปลี่ยนการควบคุม ส่วนที่สองขัดจังหวะนิพจน์ที่กำหนดเป็นพิเศษ

ตัวอย่างที่ 1

ตัวอย่างต่อไปนี้วนซ้ำองค์ประกอบในอาร์เรย์จนกว่าจะพบองค์ประกอบที่มีค่าเป็น theValue:

สำหรับ (i = 0; i< a.length; i++) { if (a[i] == theValue) { break; } }

ตัวอย่างที่ 2: ป้ายกำกับขัดจังหวะ var x = 0; var z = 0 labelCancelLoops: while (true) ( ​​​​console.log("Outer loop: " + x); x += 1; z = 1; while (true) ( ​​​​console.log("วงใน: " + z) ; z += 1; if (z === 10 && x === 10) ( break labelCancelLoops; ) else if (z === 10) ( break; ) ) ดำเนินการต่อ

คำสั่ง Continue ใช้เพื่อก้าวไปข้างหน้าหนึ่งก้าวในขณะที่ , do- While , สำหรับลูป หรือเพื่อข้ามไปยังป้ายกำกับ

• เมื่อคุณใช้ Continue โดยไม่มีป้ายกำกับ มันจะตัดการวนซ้ำปัจจุบันของ while , do- While และ for ลูป และดำเนินการต่อจากการวนซ้ำครั้งถัดไป ต่างจากตัว break ตรงที่ Continue จะไม่ขัดจังหวะการทำงานของลูปโดยสิ้นเชิง ใน while loop มันจะข้ามไปที่เงื่อนไข และสำหรับมันเพิ่มขั้นตอน
• เมื่อคุณใช้ Continue กับป้ายกำกับ มันจะนำไปใช้กับลูปที่มีป้ายกำกับนั้น

ไวยากรณ์ดำเนินการต่ออาจมีลักษณะดังนี้:

ดำเนินการต่อ;

ดำเนินการต่อ ฉลาก ;

ตัวอย่างที่ 1

ตัวอย่างต่อไปนี้แสดงการวนซ้ำ while พร้อมกับคำสั่ง Continue ที่เริ่มทำงานเมื่อค่าของ i คือ 3 ดังนั้น n จะได้รับค่า 1, 3, 7 และ 12

วาร์ ฉัน = 0; วาร์ n = 0; ในขณะที่ (i< 5) { i++; if (i == 3) { continue; } n += i; }

ตัวอย่างที่ 2

ทำเครื่องหมายนิพจน์แล้ว ตรวจสอบและjมีนิพจน์ที่ทำเครื่องหมายไว้ เช็คเจ- เมื่อเผชิญหน้า Continue โปรแกรมจะยกเลิกการวนซ้ำปัจจุบัน เช็คเจและเริ่มการวนซ้ำครั้งถัดไป ทุกครั้งที่เจอต่อ เช็คเจดำเนินการวนซ้ำครั้งถัดไปตราบใดที่เงื่อนไขส่งกลับค่า false เมื่อคืนค่าเท็จหลังจากคำนวณส่วนที่เหลือของการหาร ตรวจสอบและj, ตรวจสอบและjดำเนินการวนซ้ำครั้งถัดไปตราบใดที่เงื่อนไขส่งคืนค่า false เมื่อคืนค่าเท็จ โปรแกรมจะดำเนินการต่อจากนิพจน์หลังจากนั้น ตรวจสอบและj.

หากทำเครื่องหมายดำเนินการต่อ ตรวจสอบและj, โปรแกรมสามารถดำเนินต่อไปได้ตั้งแต่จุดเริ่มต้นของเครื่องหมาย ตรวจสอบและj.

Checkiandj: ในขณะที่ (i< 4) { console.log(i); i += 1; checkj: while (j >4) ( console.log(j); j -= 1; if ((j % 2) != 0) ( checkj ต่อไป; ) console.log(j + "even."); ) console.log("i = " + ฉัน);

console.log("j = " + j);

- สำหรับ...ในคำสั่ง for...in วนซ้ำคุณสมบัติที่นับได้ทั้งหมดของอ็อบเจ็กต์ JavaScript จะดำเนินการนิพจน์ที่ระบุสำหรับแต่ละ

ทรัพย์สินแยกต่างหาก

- for...in loop มีลักษณะดังนี้:

สำหรับ (ตัวแปรในวัตถุ) (นิพจน์)

ตัวอย่าง
ฟังก์ชันต่อไปนี้รับวัตถุและชื่อเป็นอาร์กิวเมนต์ จากนั้นจะวนซ้ำคุณสมบัติทั้งหมดของออบเจ็กต์และส่งกลับสตริงที่มีชื่อคุณสมบัติและค่าของมัน

ฟังก์ชัน dump_props(obj, obj_name) ( var result = ""; for (var i ใน obj) ( result += obj_name + "." + i + " = " + obj[i] + " "; ) ผลลัพธ์ += ""; กลับผลลัพธ์; )สำหรับวัตถุรถยนต์ที่มีคุณสมบัติยี่ห้อและรุ่น

ผลลัพธ์

จะ :

Car.make = รถฟอร์ด รุ่น = มัสแตง

ตัวอย่างหมายเลข 2

คุณยังสามารถแสดงค่าด้วยคีย์:

แม้ว่าการใช้ for... เป็นวิธีหนึ่งในการวนซ้ำองค์ประกอบทั้งหมดของ Array เป็นเรื่องที่น่าดึงดูดใจ แต่ตัวดำเนินการนี้จะส่งคืนชื่อของคุณสมบัติที่ผู้ใช้กำหนดนอกเหนือจากดัชนีตัวเลข ดังนั้นจึงเป็นการดีกว่าที่จะใช้มาตรฐาน for สำหรับดัชนีตัวเลขเมื่อโต้ตอบกับอาร์เรย์ เนื่องจากคำสั่ง for...in ดำเนินไป ผู้ใช้เฉพาะคุณสมบัตินอกเหนือจากองค์ประกอบอาร์เรย์หากคุณแก้ไขอาร์เรย์ เช่น การเพิ่มคุณสมบัติและวิธีการ

สำหรับ( ตัวแปรของ วัตถุ) { การแสดงออก}

ตัวอย่างต่อไปนี้แสดงความแตกต่างระหว่าง for...of และ for...in ลูป ในขณะที่ for...in วนซ้ำชื่อคุณสมบัติ for...of วนซ้ำค่าคุณสมบัติ:

ให้ arr = ; arr.foo = "สวัสดี"; for (let i in arr) ( console.log(i); // พิมพ์ "0", "1", "2", "foo" ) for (let i of arr) ( console.log(i); / / เอาท์พุต "3", "5", "7")

อัปเดตครั้งล่าสุด: 04/08/2018

ลูปช่วยให้คุณดำเนินการได้หลายครั้งขึ้นอยู่กับเงื่อนไขบางประการ จาวาสคริปต์มี ประเภทต่อไปนี้รอบ:

สำหรับ..ใน

สำหรับ..ของ

ในขณะที่

ทำ..ในขณะที่

สำหรับวง

for loop มีคำจำกัดความที่เป็นทางการดังต่อไปนี้:

สำหรับ ([เริ่มต้นตัวนับ]; [เงื่อนไข]; [เปลี่ยนตัวนับ])( // actions )

ตัวอย่างเช่น เราใช้ for loop เพื่อวนซ้ำองค์ประกอบของอาร์เรย์:

คนวาร์ = ["ทอม", "อลิซ", "บ๊อบ", "แซม"]; สำหรับ (var i = 0; i= 0; i--)( console.log(คน[i]); )

ใน ในกรณีนี้อาร์เรย์จะถูกส่งออกจากจุดสิ้นสุด และอาร์เรย์จะถูกวนซ้ำจาก i = 3 ถึง i = 0

สำหรับ..ใน

for..in loop ได้รับการออกแบบมาเพื่อวนซ้ำผ่านอาร์เรย์และอ็อบเจ็กต์ คำจำกัดความอย่างเป็นทางการของมันคือ:

สำหรับ (จัดทำดัชนีในอาร์เรย์) ( // actions )

ตัวอย่างเช่น เรามาวนซ้ำองค์ประกอบอาร์เรย์:

คนวาร์ = ["ทอม", "อลิซ", "บ๊อบ", "แซม"]; สำหรับ (ดัชนี var ในคน) ( console.log (คน); )

ห่วงสำหรับ...ของ

for...of loop คล้ายกับ for...in loop และได้รับการออกแบบให้วนซ้ำผ่านคอลเลกชัน เช่น อาร์เรย์:

ให้ผู้ใช้ = ["ทอม", "บ๊อบ", "แซม"]; สำหรับ (ให้ val ของผู้ใช้) console.log(val);

องค์ประกอบคอลเลกชันปัจจุบันที่ถูกวนซ้ำจะถูกวางไว้ในตัวแปร val จากนั้นค่าจะถูกพิมพ์ไปยังคอนโซล

ในขณะที่วนซ้ำ

while loop จะทำงานตราบเท่าที่เงื่อนไขบางประการเป็นจริง คำจำกัดความอย่างเป็นทางการของมันคือ:

ในขณะที่ (เงื่อนไข) ( // การกระทำ )

อีกครั้ง เราจะแสดงองค์ประกอบอาร์เรย์โดยใช้ while:

คนวาร์ = ["ทอม", "อลิซ", "บ๊อบ", "แซม"]; ดัชนี var = 0; ในขณะที่(index< people.length){ console.log(people); index++; }

while loop ที่นี่จะดำเนินการจนกว่าค่าของดัชนีจะกลายเป็น เท่ากับความยาวอาร์เรย์

ทำ..ในขณะที่

ใน do loop โค้ดลูปจะถูกดำเนินการก่อน จากนั้นจะมีการตรวจสอบเงื่อนไขในคำสั่ง while และตราบใดที่เงื่อนไขนี้เป็นจริง วงจรก็จะเกิดซ้ำ ตัวอย่างเช่น:

วาร์ x = 1; ทำ (console.log (x * x); x ++; ) ในขณะที่ (x< 10)

ที่นี่โค้ดลูปจะทำงาน 9 ครั้งจนกระทั่ง x กลายเป็น 10 do loop รับประกันว่าการดำเนินการจะถูกดำเนินการอย่างน้อยหนึ่งครั้ง แม้ว่าเงื่อนไขในคำสั่ง while จะไม่เป็นจริงก็ตาม

ดำเนินการต่อและทำลายคำสั่ง

บางครั้งจำเป็นต้องออกจากลูปก่อนจึงจะเสร็จสมบูรณ์ ในกรณีนี้ เราสามารถใช้คำสั่งแบ่งได้:

< array.length; i++) { if (array[i] >10) แตก;
"); }

document.write(อาร์เรย์[i] + "

ลูปนี้จะวนซ้ำองค์ประกอบทั้งหมดของอาร์เรย์ แต่องค์ประกอบสี่รายการสุดท้ายจะไม่แสดงในเบราว์เซอร์ เนื่องจากการทดสอบถ้า (อาร์เรย์[i] > 10) จะขัดจังหวะลูปด้วยคำสั่งแบ่งเมื่อวนซ้ำผ่านอาร์เรย์ถึง องค์ประกอบที่ 12

หากเราต้องการข้ามการวนซ้ำ แต่ไม่ออกจากลูป เราสามารถใช้คำสั่ง Continue ได้:< array.length; i++) { if (array[i] >อาร์เรย์ Var = [ 1, 2, 3, 4, 5, 12, 17, 6, 7 ]; สำหรับ (var i = 0; i
"); }

10) ดำเนินการต่อ;

document.write(อาร์เรย์[i] + "

ในกรณีนี้ หากโปรแกรมพบตัวเลขที่มากกว่า 10 ในอาร์เรย์ หมายเลขนี้จะไม่ปรากฏในเบราว์เซอร์

บ่อยครั้งคุณจำเป็นต้องมีบางส่วนของโปรแกรมเพื่อดำเนินการหลายครั้ง แน่นอนคุณสามารถทำได้: คัดลอกและวางตามจำนวนครั้งที่ต้องการ อย่างไรก็ตาม นี่เป็นเรื่องไร้สาระ โดยเฉพาะอย่างยิ่งหากต้องดำเนินการ เช่น 1,000 ครั้ง ดังนั้นจึงมีสิ่งที่เรียกว่าลูปซึ่งมีอยู่ในภาษาโปรแกรมส่วนใหญ่ และฉันจะเล่าให้คุณฟังเกี่ยวกับพวกเขา

ประกอบด้วยโค้ดเฉพาะที่ถูกเลื่อนหลายครั้ง การวนซ้ำมีหลายประเภท: for, while และ do- While
มาเริ่มกันที่วงแรก (และเป็นวงที่ได้รับความนิยมมากที่สุด) - วง for ลักษณะทั่วไปของวงจรนี้มีดังนี้:
}

สำหรับ (iteration_variable = default_value; เงื่อนไข; action_after_each_iteration) ( //รหัสโปรแกรมให้ฉันแสดงความคิดเห็นเกี่ยวกับสิ่งที่เขียนที่นี่ มาครั้งแรก - ตัวแปรการวนซ้ำ- นี่คือชื่อตัวแปรปกติสำหรับการวนซ้ำ ต่อไปมา

Initial_value

สำหรับ (i = 0; i< 100; i++)
- จริงๆแล้วชื่อนี้พูดเพื่อตัวมันเอง ถัดไปคือเงื่อนไข เมื่อปฏิบัติตามแล้ว (นั่นคือ คืนค่าจริง) ลูปจะถูกเปิดใช้งานอีกครั้ง และสุดท้ายคือการดำเนินการที่จะดำเนินการหลังจากการวนซ้ำแต่ละครั้ง โดยทั่วไปนี่คือการเปลี่ยนแปลงตัวแปรสำหรับการวนซ้ำ

มาเขียนสคริปต์ง่ายๆ ที่จะแสดงจำนวนการวนซ้ำ: document.write(i + " ");< 100 ที่นี่เราได้กำหนดตัวแปรสำหรับการวนซ้ำ (เรียกว่า i) ซึ่งได้รับการกำหนดค่าเป็น 0 ถัดไปมีการตรวจสอบเงื่อนไข: ฉัน(นั่นคือการเพิ่มตัวแปร i ขึ้น 1) มีการตรวจสอบเงื่อนไขอีกครั้ง และหากเป็นจริง ก็จะทำการวนซ้ำอีกครั้ง และต่อๆ ไปจนเกิดภาวะ document.write(i + " ");< 100 จะไม่กลายเป็นเท็จ แน่นอนว่ามันจะเป็นเท็จหลังจากการวนซ้ำ 100 ครั้งเท่านั้น ดังนั้นการวนซ้ำนี้จะถูกดำเนินการ 100 ครั้ง ซึ่งเราจะเห็นว่าเรารันสคริปต์นี้หรือไม่ และอีกอย่างหนึ่ง เนื่องจากเรามีตัวดำเนินการเพียงตัวเดียวที่ดำเนินการที่นี่ (document.write() ) ดังนั้นการมีอยู่ วงเล็บปีกกาไม่จำเป็น. หากคุณมีโอเปอเรเตอร์ 2 ตัวขึ้นไปที่ทำงานอยู่ในลูป คุณจะต้องติดตั้งตัวดำเนินการเหล่านั้น

ตอนนี้เรามาพูดถึงลูปประเภทที่สองใน JavaScript - while โดยหลักการแล้ว การวนซ้ำจะคล้ายกับการวนซ้ำสำหรับ for มาก (แม้ว่าการวนซ้ำทั้งหมดจะคล้ายกันก็ตาม) แต่ที่นี่ มุมมองทั่วไปอื่น:

ในขณะที่ (เงื่อนไข) (
มาเริ่มกันที่วงแรก (และเป็นวงที่ได้รับความนิยมมากที่สุด) - วง for ลักษณะทั่วไปของวงจรนี้มีดังนี้:
}

อย่างที่คุณเห็น ไม่มีตัวแปรสำหรับการวนซ้ำหรือการดำเนินการใดๆ หลังจากการวนซ้ำ ข้อสรุปตามมาจากนี้: ในการที่จะออกจากลูปจำเป็นต้องทำในลูปเองเพื่อที่ " เงื่อนไข" กลายเป็นเท็จ หากไม่ดำเนินการ จะเกิดการวนซ้ำ และด้วยเหตุนี้ สคริปต์ของคุณจึงจะหยุดทำงาน

เรามาใช้งานแบบเดิมเหมือนเดิม แต่ใช้การวนซ้ำแบบ while

วาร์ ฉัน = 0;
ในขณะที่ (i< 100) {
ฉัน++;
document.write(i + " ");
}

ก่อนที่จะเริ่มลูป เราได้สร้างตัวแปร i ซึ่งถูกกำหนดเป็นค่าเริ่มต้น จากนั้น ก่อนที่จะเริ่มลูป เงื่อนไขจะถูกตรวจสอบ และหากเป็นจริง จากนั้นจะมีการเรียกใช้การวนซ้ำ โดยเราจะเพิ่มตัวแปรสำหรับการวนซ้ำ (ไม่เช่นนั้นจะเกิดการวนซ้ำ) และเราจะแสดงตัวแปรนี้

และสุดท้าย ประเภทสุดท้ายของลูปใน JavaScript ก็คือ ทำในขณะที่วนซ้ำ- ไวยากรณ์คือ:

ทำ(
มาเริ่มกันที่วงแรก (และเป็นวงที่ได้รับความนิยมมากที่สุด) - วง for ลักษณะทั่วไปของวงจรนี้มีดังนี้:
) ในขณะที่ (เงื่อนไข)

คล้ายกันมากกับ while loop อย่างไรก็ตาม มีเพียงสิ่งเดียวเท่านั้น แต่มันสำคัญมาก ความแตกต่างพื้นฐาน- หากการวนซ้ำ while ตรวจสอบเงื่อนไขก่อน แล้วจึงวนซ้ำหรือไม่ การวนซ้ำ do- While จะวนซ้ำก่อน จากนั้นจึงตรวจสอบเงื่อนไขเท่านั้น และถ้าเป็นเท็จก็จะออกจากลูป กล่าวอีกนัยหนึ่ง ไม่ว่าเงื่อนไขจะเป็นอย่างไร การวนซ้ำนี้รับประกันว่าจะดำเนินการอย่างน้อยหนึ่งครั้ง ฉันคิดว่าอย่างนั้น รหัสนี้มันจะซ้ำซ้อน แต่ก็ยัง

วาร์ ฉัน = 0;
ทำ (
ฉัน++;
document.write(i + " ");
) ในขณะที่ (i< 100)

ฉันจะไม่อธิบายรหัส ฉันแน่ใจว่าคุณจะเข้าใจมันโดยไม่มีฉัน ดังนั้น ผมควรไปยังข้อความที่น่าสนใจสองข้อความ: ทำลายและดำเนินการต่อ

เริ่มต้นด้วยการหยุดพัก โอเปอเรเตอร์นี้ช่วยให้คุณออกจากวงจรได้เร็ว มาเขียนโค้ดต่อไปนี้:

สำหรับ (i = 0; i< 100; i++) {
ถ้า (i == 50) แตก;
document.write(i + " ");
}

คุณสามารถเรียกใช้สคริปต์นี้และพบว่าพิมพ์เฉพาะตัวเลขสูงสุด 49 เท่านั้นเนื่องจากเมื่อใด ผม = 50การวนซ้ำถูกขัดจังหวะด้วยคำสั่งแบ่ง

ตอนนี้ฉันกำลังพูดถึงตัวดำเนินการดำเนินการต่อ โอเปอเรเตอร์นี้ช่วยให้คุณย้ายไปยังการวนซ้ำครั้งถัดไป เพื่อไม่ให้อธิบายมากเกินไป ควรยกตัวอย่างทันที:

สำหรับ (i = 0; i< 100; i++) {
ถ้า (i == 50) ดำเนินการต่อ;
document.write(i + " ");
}

หากคุณรันสคริปต์นี้ คุณจะเห็นว่าหมายเลข 50 หายไป เรื่องนี้เกิดขึ้นเพราะว่าเมื่อไร ผม = 50เราจะไปยังการวนซ้ำครั้งถัดไปของลูป ก่อนหน้านั้น i เพิ่มขึ้น 1 และกลายเป็นเท่ากับครั้งที่ 51

ดูเหมือนว่านั่นคือทั้งหมดที่ฉันอยากจะเขียนถึง ลูป JavaScript- ฉันหวังว่าทุกอย่างชัดเจนสำหรับคุณ คุณยังสามารถคิดปัญหาให้ตัวเองและแก้ไขได้ นี่จะเป็นการออกกำลังกายที่ยอดเยี่ยม

|

เนื่องจากในขณะที่และทำ...ในขณะที่มีเงื่อนไข พวกเขาจะถูกดำเนินการเมื่อคำสั่งที่กำหนดประเมินเป็นจริง คำสั่ง for นั้นขึ้นอยู่กับเงื่อนไขเช่นกัน แต่ก็มีให้ คุณสมบัติเพิ่มเติมเช่น ตัวนับลูป ซึ่งช่วยให้คุณกำหนดจำนวนการวนซ้ำล่วงหน้าได้

บทช่วยสอนนี้จะสอนวิธีใช้ for, for...of และ for...in loops ซึ่งเป็นองค์ประกอบสำคัญของการเขียนโปรแกรมใน JavaScript

สำหรับลูป

for loop สามารถใช้นิพจน์เสริมได้สูงสุดสามนิพจน์เพื่อรันบล็อกโค้ดซ้ำๆ

ลองดูที่ไวยากรณ์ของลูป

for (การเริ่มต้น; เงื่อนไข; การแสดงออกขั้นสุดท้าย) (
// รหัสที่จะดำเนินการ
}

• การเริ่มต้น (หากระบุ) เริ่มตัวนับและประกาศตัวแปร
• เงื่อนไขจะได้รับการประมวลผลต่อไป หากเป็นจริง โปรแกรมจะดำเนินการโค้ดต่อไปนี้ ถ้าเป็นเท็จ วงจะขาด
• จากนั้นโค้ดที่ต้องดำเนินการจะถูกประมวลผล
• หากมีการระบุนิพจน์สุดท้าย นิพจน์นั้นจะถูกอัพเดต หลังจากนั้นลูปจะกลับสู่การประมวลผลเงื่อนไข

เพื่อให้เข้าใจถึงวิธีการทำงาน มาดูตัวอย่างพื้นฐานกัน

สำหรับ (ให้ i = 0; i< 4; i++) {
// พิมพ์การวนซ้ำแต่ละครั้งไปยังคอนโซล
console.log(ผม);
}

หากคุณรันโค้ดนี้ คุณจะได้ผลลัพธ์ดังนี้:

0
1
2
3

ในตัวอย่างข้างต้น for loop เริ่มต้นด้วยตัวแปร ให้ i = 0 ซึ่งจะเริ่มต้นลูปด้วยค่า 0 เงื่อนไขในลูปคือ i< 4, а это означает, что до тех пор, пока значение i меньше 4, цикл будет продолжать работу. Финальное выражение i++ определяет счетчик для каждой итерации цикла. console.log(i) выводит числа, начиная с 0, и останавливается, как только i равняется 4.

หากไม่มีการวนซ้ำ โค้ดที่ทำสิ่งเดียวกันจะเป็น:

// ตั้งค่าตัวแปรเริ่มต้นเป็น 0
ให้ฉัน = 0;
// เพิ่มตัวแปรด้วยตนเอง 1 สี่ครั้ง
console.log(i++);
console.log(i++);
console.log(i++);
console.log(i++);

หากไม่มีลูป บล็อกโค้ดจะประกอบด้วย มากกว่าเส้น หากต้องการเพิ่มจำนวน เราจะต้องเพิ่มบรรทัดเพิ่มเติมในโค้ด

ลองดูที่แต่ละนิพจน์ในวง

การเริ่มต้น

นิพจน์แรกในลูปคือการเริ่มต้น

มันประกาศตัวแปร i โดยใช้คีย์เวิร์ด Let (คุณสามารถใช้ คำหลัก var) และกำหนดค่าเป็น 0 คุณสามารถใช้ชื่อตัวแปรใดๆ ก็ได้ในลูป แต่ตัวแปร i จะเชื่อมโยงกับคำว่า "การวนซ้ำ" และจะไม่ทำให้โค้ดโอเวอร์โหลด

เงื่อนไข

เช่นเดียวกับ while และ do... While ลูป for ลูปมักจะมีเงื่อนไข ใน ในตัวอย่างนี้นี้:

ซึ่งหมายความว่านิพจน์ประเมินเป็นจริงตราบใดที่ค่าของ i น้อยกว่า 4

การแสดงออกครั้งสุดท้าย

นี่คือนิพจน์ที่ดำเนินการเมื่อสิ้นสุดแต่ละลูป มักใช้เพื่อเพิ่มหรือลดค่าของตัวแปร แต่สามารถใช้เพื่อวัตถุประสงค์อื่นได้

ในตัวอย่างนี้ การวนซ้ำจะเพิ่มตัวแปรทีละหนึ่ง นิพจน์ i++ ทำสิ่งเดียวกันกับ i = i + 1

ไม่เหมือนกับจุดเริ่มต้นและเงื่อนไข นิพจน์สุดท้ายไม่ได้ลงท้ายด้วยเครื่องหมายอัฒภาค

ห่วงร่างกาย

ตอนนี้คุณรู้ส่วนประกอบทั้งหมดของ for loop แล้ว มาดูโค้ดกันอีกครั้ง

// เริ่มต้นคำสั่ง for ด้วยการวนซ้ำ 5 ครั้ง
สำหรับ (ให้ i = 0; i< 4; i++) {
console.log(ผม);
}

นิพจน์แรกระบุ มูลค่าเดิมตัวแปร (0) ตัวที่สองกำหนดเงื่อนไข (ลูปถูกดำเนินการในขณะที่ i น้อยกว่า 4) และตัวที่สามระบุขั้นตอนของการวนซ้ำแต่ละครั้ง (ในกรณีนี้ ค่าจะเพิ่มขึ้น 1)

คอนโซลจะส่งออกค่า: 0, 1, 2 และ 3 จากนั้นการวนซ้ำจะขาด

นิพจน์ทางเลือก

นิพจน์ for loop ทั้งหมดเป็นทางเลือก ตัวอย่างเช่น คุณสามารถเขียนแบบเดียวกันสำหรับลูป แต่ข้ามการกำหนดค่าเริ่มต้นและเริ่มต้นตัวแปรภายนอกลูป

ให้ฉัน = 0;
// เริ่มต้นการวนซ้ำ
สำหรับ(;i< 4; i++) {
console.log(ผม);
}
0
1
2
3

ในกรณีนี้ อัฒภาคแรกบ่งชี้ว่าจุดเริ่มต้นหายไป

หมายเหตุ: แม้ว่าคุณจะไม่ได้ใช้นิพจน์ใดนิพจน์หนึ่ง คุณต้องใส่เครื่องหมายอัฒภาค มิฉะนั้นระบบจะตีความการวนซ้ำไม่ถูกต้อง

นอกจากนี้ เป็นตัวอย่าง คุณสามารถลบเงื่อนไขออกจากลูปได้ หากต้องการหยุดการวนซ้ำเมื่อค่าของตัวแปรมากกว่า 3 ให้ใช้ if และ break

// ประกาศตัวแปรนอกลูป
ให้ฉัน = 0;
//ละเว้นการเริ่มต้นและเงื่อนไข
สำหรับ (; ; i++) (
ถ้า (ผม > 3) (
หยุดพัก;
}
console.log(ผม);
}
0
1
2
3

สำคัญ! ในการวนซ้ำโดยไม่มีเงื่อนไข คุณต้องใช้ คำสั่งแบ่ง- มิฉะนั้น ลูปจะไม่สามารถถูกขัดจังหวะได้ (ลูปดังกล่าวเรียกว่าไม่มีที่สิ้นสุด) และจะทำให้เบราว์เซอร์ขัดข้อง

คุณยังสามารถลบนิพจน์สุดท้ายออกจากลูปได้ สามารถระบุขั้นตอนได้ที่ส่วนท้ายของโค้ดลูป ในกรณีนี้ คุณต้องปล่อยอักขระ “;” ทั้งสองตัวไว้ในวงเล็บ ไม่เช่นนั้นการวนซ้ำจะไม่ทำงาน

// ประกาศตัวแปรนอกลูป
ให้ฉัน = 0;
//ละเว้นข้อความทั้งหมด
สำหรับ (; ;) (
ถ้า (ผม > 3) (
หยุดพัก;
}
console.log(ผม);
ฉัน++;
}
0
1
2
3

อย่างที่คุณเห็น นิพจน์แบบวนซ้ำจะสร้างโค้ดที่กระชับและอ่านง่ายที่สุด

การเปลี่ยนอาร์เรย์

for loop สามารถใช้แก้ไขอาร์เรย์ได้

ตัวอย่างต่อไปนี้แสดงวิธีการสร้างอาร์เรย์ว่างและเติมตัวแปรโดยใช้ตัวนับลูป สร้างไฟล์ modifiedArray.js และเพิ่มโค้ดต่อไปนี้:

// เริ่มต้นอาร์เรย์ว่าง
ให้ arrayExample = ;
// เริ่มต้นการวนซ้ำเพื่อรัน 3 ครั้ง
สำหรับ (ให้ i = 0; i< 3; i++) {
// อัพเดตอาร์เรย์ด้วยค่าตัวแปร
arrayExample.push(i);
console.log(arrayExample);
}

เปิดโปรแกรม มันจะส่งออก:

[ 0 ]
[ 0, 1 ]
[ 0, 1, 2 ]

การวนซ้ำที่กำหนดจะถูกดำเนินการจนกระทั่งฉัน< 3 перестанет быть истинным. Массив arrayExample выводится в консоль в конце каждой итерации. Так вы можете увидеть, как массив пополняется новыми значениями.

ความยาวอาร์เรย์

บางครั้งจำเป็นต้องดำเนินการวนซ้ำหลายครั้ง แต่การกำหนดจำนวนการวนซ้ำที่ต้องการนั้นเป็นเรื่องยาก แทนที่จะประกาศจำนวนการวนซ้ำ ดังตัวอย่างก่อนหน้านี้ คุณสามารถใช้คุณสมบัติ length เพื่อทำให้ลูปทำงานได้หลายครั้งตามที่มีองค์ประกอบในอาร์เรย์

// ประกาศอาร์เรย์ด้วย 3 รายการ
ให้ปลา = [ "flunder", "salmon", "pike" ];
// เริ่มต้นให้ลูปทำงานตามความยาวรวมของอาร์เรย์
สำหรับ (ให้ i = 0; i< fish.length; i++) {
// พิมพ์แต่ละรายการไปยังคอนโซล
console.log(ปลา[i]);
}

โปรแกรมดังกล่าวจะให้ผลลัพธ์:

ดิ้นรน
ปลาแซลมอน
หอก

ลูปนี้จะวนซ้ำแต่ละดัชนีอาร์เรย์โดยใช้ fish[i] สิ่งนี้นำไปสู่ อัพเดตแบบไดนามิกดัชนีในการวนซ้ำแต่ละครั้ง