for loop / javascript
For loop in JavaScript is an instruction used for iterating a set of instructions or blocks of code repeatedly a given number of times. 🔁 It is one of the main methods of iteration (iteration) in JavaScript.
Elements of the for loop
The syntax of the for loop has 3 key parts in parentheses separated by semicolons (semicolon -;) as follows:
JavaScript
for ([initiation]; [condition]; [increase / devaluation]) {
/ / Blocks of code to be reworked
}
< hr >
1. Initialization
This section will be executed only once before the iteration begins.
It is often used to declare and assign default values to counter variables, such as: let i = 0.
2. Conditions
This part is to check the logic (Boolean expression) that will be done every time before each iteration.
If the condition is true, the code in the block will be executed.
If the condition is false, the iteration will stop immediately.
Example: i < 10 (loop as long as i is less than 10).
3. Increasing / decreasing
This section will be executed after the completion of each cycle of the code block.
It is often used to improve the value of the counter, such as increasing by 1 (i + +) or decreasing by (i--).
< hr >
Example of use
An example of an iteration to print a number from 0 to 4:
JavaScript
for (let i = 0; i < 5; i + +) {
console.log ("round:" + i);
}
/ / Results:
/ / Round at: 0
/ / Round: 1
/ / Round: 2
/ / Round: 3
/ / Round: 4
นอกจากโครงสร้างพื้นฐาน for ([การเริ่มต้น]; [เงื่อนไข]; [การเพิ่ม/ลดค่า]) { ... } แล้ว เวลาเอา for loop JavaScript ไปใช้จริง ๆ มักเจอ “เคสยอดฮิต” ที่คนเริ่มต้นสับสนอยู่บ่อย ๆ เลยขอสรุปเพิ่มแบบที่ผมใช้จำและใช้เขียนงานจริงให้ค่ะ 1) วน Array / List แบบอ่านง่าย ถ้าเรามีอาเรย์ เช่น cars = ["BMW", "Volvo", "Saab", "Ford"] หลักคิดคือวนด้วย index แล้วหยิบค่ามาใช้ for (let i = 0; i < cars.length; i++) { console.log(cars[i]); } จุดที่พลาดบ่อย: ใช้ i <= cars.length ทำให้รอบสุดท้าย index เกิน (ได้ undefined) ดังนั้นส่วนใหญ่ใช้ i < cars.length จะปลอดภัยกว่า 2) เริ่มที่ 1 ไม่ใช่ 0 ได้ไหม? ได้เลย แค่เปลี่ยนค่าเริ่มต้น เช่นอยากพิมพ์ 1 ถึง 5 for (let i = 1; i <= 5; i++) { console.log("รอบที่: " + i); } จำง่าย ๆ: ถ้าเริ่มที่ 1 และอยากให้ถึง 5 ให้ใช้เงื่อนไข i <= 5 3) i++ vs i-- และการกำหนด step มากกว่า 1 - i++ คือเพิ่มทีละ 1 - i-- คือลดทีละ 1 - เพิ่มทีละ 2 ก็ทำได้ เช่น i += 2 for (let i = 0; i < 10; i += 2) { console.log(i); // 0,2,4,6,8 } 4) หยุด loop ก่อนกำหนดด้วย break เคสนี้ใช้ตอน “เจอสิ่งที่ต้องการแล้วไม่ต้องวนต่อ” ประหยัดเวลา for (let i = 0; i < cars.length; i++) { if (cars[i] === "Saab") { break; } console.log(cars[i]); } ผลคือจะพิมพ์แค่ BMW, Volvo แล้วหยุดทันทีเมื่อเจอ Saab 5) ข้ามบางรอบด้วย continue ถ้าต้องการข้ามบางเงื่อนไข แต่ยังวนต่อรอบถัดไป for (let i = 0; i < 5; i++) { if (i === 2) continue; console.log("รอบที่: " + i); } รอบที่ 2 จะไม่ถูกพิมพ์ 6) ทริคกันงง: ลำดับการทำงานของ for loop จากประสบการณ์ ถ้าจำลำดับนี้ได้จะอ่านโค้ดง่ายขึ้น: - ทำ Initialization (ครั้งเดียว) - เช็ค Condition (ก่อนทุกครั้ง) - ทำในบล็อก { ... } - ทำ Increment/Decrement (หลังทุกครั้ง) ถ้าคุณกำลังฝึก for loop JavaScript แนะนำให้ลอง “ไล่ค่าด้วยกระดาษ” โดยเขียน i ในแต่ละรอบ หรือใส่ console.log(i) เพื่อตรวจสอบ จะช่วยลดบั๊กแบบ i เกิน/วนไม่หยุดได้มากค่ะ
