Flow Control 4 - Program Looping

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

ActionScript 3.0 Program Looping

Program Looping นั้นมีประโยชน์อย่างไร ขอให้เรามาดูรูปตัวอย่างนี้กันก่อนนะครับ

ในรูปด้านบนนี้คือ Triangular Number นั่นเองครับ เราสามารถพูดได้ว่า 

• Triangular Number ขั้นที่ 1 มีค่าเท่ากับ 1
• Triangular Number ขั้นที่ 2 มีค่าเท่ากับ 3
• Triangular Number ขั้นที่ 3 มีค่าเท่ากับ 6
• Triangular Number ขั้นที่ 4 มีค่าเท่ากับ 10
• Triangular Number ขั้นที่ 5 มีค่าเท่ากับ 15
• Triangular Number ขั้นที่ 6 มีค่าเท่าไหร่ครับ?

พอจะนึกกันออกใช่มั้ยครับ เมื่อวิเคราะห์แล้วเราจะทราบว่าโครงสร้างของ Triangular Number มีลักษณะดังนี้

• Triangular Number ขั้นที่ 1 มีค่าเท่ากับ 1
• Triangular Number ขั้นที่ 2 มีค่าเท่ากับ 1 + 2 = 3
• Triangular Number ขั้นที่ 3 มีค่าเท่ากับ 1 + 2 + 3 = 6
• Triangular Number ขั้นที่ 4 มีค่าเท่ากับ 1 + 2 + 3 + 4 = 10
• Triangular Number ขั้นที่ 5 มีค่าเท่ากับ 1 + 2 + 3 + 4 + 5 = 15
• Triangular Number ขั้นที่ 6 มีค่าเท่ากับ 1 + 2 + 3 + 4 + 5 + 6 = 21

โอเค Triangular Number ขั้นที่เท่าไหร่ก็ตามจะมีค่าเท่ากับ 1 + 2 + 3 + 4 + ต่อๆ ไปเรื่อยๆ จนถึงตัวเลขเดียวกับขั้นของ Triangular Number ที่ต้องการหานั่นเองครับ หรือเขียนให้ดู งงๆ ตามหลักคณิตศาสตร์ได้เป็น

Tn = 1 + 2 + 3 + 4 + ... + (n - 1) + n

 เอาหละ ทีนี้ถ้าเราอยากจะเขียนโปรแกรมแสดงผลค่า Triangular Number ตั้งแต่ขั้นที่ 1 จนถึงขั้นที่ 5 จะเขียนได้ยังไง

ลองเขียนแบบนี้ก็ได้ รับรองถูกต้องแน่นอนไม่มีปัญหา

var t1:int = 1;

var t2:int = 1 + 2;

var t3:int = 1 + 2 + 3;

var t4:int = 1 + 2 + 3 + 4;

var t5:int = 1 + 2 + 3 + 4 + 5;

trace("t1 = " + t1);

trace("t2 = " + t2);

trace("t3 = " + t3);

trace("t4 = " + t4);

trace("t5 = " + t5);

และเมื่อลองรันโปรแกรมดูก็จะได้ผลดังภาพด้านล่างนี้

คราวนี้สมมติโจทย์ยากขึ้นมาอีกหน่อย ถ้าเราอยากจะเขียนโปรแกรมแสดงผลค่า Triangular Number ขั้นขั้นที่ 100 หละครับ เขียนได้มั้ยครับ

ยัง ได้อยู่ไม่มีปัญหา แต่เหนื่อยหน่อยใช่มั้ยครับ แล้วถ้าเราอยากจะแสดงผลค่า Triangular Number ขั้นที่ 1,000 หรือขั้นที่ 2,000 หละครับ

เอาหละสิ เหงื่อเริ่มตกหละทีนี้ จะเขียนยังไงไหว

Program Looping มันจึงมีไว้เพื่อแก้ปัญหาการทำซ้ำหลายๆ ครั้งแบบนี้โดยเฉพาะครับ

Program Looping

สำหรับภาษา ActionScript 3.0 นั้น มีวิธีเขียนลูปหลักๆ อยู่ 3 วิธี ตาม Keyword และ Syntax ที่มันมีให้ ได้แก่

• for
• while
• do

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

เรามาดูกันโดยเริ่มจาก for กันก่อนครับ

for

ตัวอย่างการเขียน for เป็นดังนี้ครับ

ตัวอย่าง for 1

var i:int;
for (i = 0; i < 10; i++)
{
    trace("i = " + i);
}

ผลที่ได้

สำหรับ for นั้นปกติเราก็จะมีตัวแปรตัวหนึ่งเป็นตัววิ่งลูป ซึ่งเมื่อการวนลูปแต่ละรอบเสร็จสิ้นจะทำการเพิ่มค่า หรือลดค่าตัววิ่งลูปนี้ (ส่วนใหญ่ทีละ 1 แต่จริงๆ แล้วจะเท่าไหร่ก็ได้) โดยลูปจะจบลงก็ต่อเมื่อ Expression ตรงกลาง (ในตัวอย่างคือ i < 10) เป็น false ก็จะออกจากลูปครับ

เจ้าตัวแปรที่ใช้เป็นตัววิ่งลูปนี้ก็มักจะตั้งชื่อมันว่า i, j, k อะไรประมาณนี้ครับ ผมก็ไม่เข้าใจเหมือนกันว่าทำไม อิอิ หากใครทราบรบกวนบอกผมด้วยจะเป็นพระคุณอย่างมากครับ

และก็ในบางที เราอาจจะประกาศตัวแปรที่จะใช้วิ่งลูปอยู่ใน for เลยก็ได้ครับ มาลองดูอีกตัวอย่างหนึ่งกัน

 ตัวอย่าง for 2

for (var i:int = 5; i < 20; i += 5)
{
    trace("i = " + i);
} 

ผลที่ได้

ลองดูตัวอย่างแบบลบค่าตัววิ่งลูปดูบ้างครับ



 ตัวอย่าง for 3

for (var i:int = 100; i > 0; i -= 10)
{
    trace("i = " + i);
}

ผลที่ได้

สรุปสำหรับ for นั้น Syntax คือ

for (กำหนดค่าเริ่มต้นของตัววิ่งลูป; ลูป Expression ที่ถ้าเป็น true จะทำต่อถ้าเป็น false จะออกจากลูป; เพิ่มค่า(หรือลดค่า)ตัววิ่งลูป)
{
    statement ที่จะทำซ้ำ;
}  

Code ที่จะถูกเรียกเวลารันลูปจะเป็น

1. กำหนดค่าเริ่มต้นของตัววิ่งลูป
2. เช็คลูป Expression ว่าเป็น true หรือ false ถ้าเป็น true ไปข้อถัดไป
3. รัน  statement ที่จะทำซ้ำ
4. เพิ่มค่า(หรือลดค่า)ตัววิ่งลูป
5. เช็คลูป Expression ว่าเป็น true หรือ false ถ้าเป็น true ไปข้อถัดไป
6. รัน statement ที่จะทำซ้ำ
7. เพิ่มค่า(หรือลดค่า)ตัววิ่งลูป
8. เช็คลูป Expression ว่าเป็น true หรือ false ถ้าเป็น true ไปข้อถัดไป
9. รัน statement ที่จะทำซ้ำ
10. เพิ่มค่า(หรือลดค่า)ตัววิ่งลูป
11. เช็คลูป Expression ว่าเป็น true หรือ false ถ้าเป็น true ไปข้อถัดไป
12. รัน statement ที่จะทำซ้ำ
13. เพิ่มค่า(หรือลดค่า)ตัววิ่งลูป
14. เช็คลูป Expression ว่าเป็น true หรือ false ถ้าเป็น true ไปข้อถัดไป
15. ...
16. ...
17. ...
18. ...
19. ...
20. เช็คลูป Expression ว่าเป็น true หรือ false ถ้าเป็น false หยุดลูปและออกจากลูป  

 กลับมาที่ปัญหาของ Triangular Number กันครับ ถ้าเราเขียนด้วย for ลูป สามารถเขียนได้ดังนี้

ตัวอย่างหาค่า Triangular Number ด้วย for

var n:int = 5;
var result:int = 0;
for (var i:int = 1; i <= n; i++)
{
    result += i;
}
trace("result for triangular number at " + n + " is = " + result); 

ผลที่ได้ 

ถ้าอยากหาค่า Triangular Number ขั้นที่เท่าไหร่ก็แค่เปลี่ยนค่า n ดูนะครับ

อ้าว แต่แบบนี้หาค่าของ Triangular Number ขั้นที่ n ได้ แล้วถ้าจะแสดงค่าของ Triangular Number ตั้งแต่ขั้นที่ 1 ถึงขั้นที่ n หละ เขียนได้มั้ย?

คำ ตอบก็คือไอ้เขียนได้มั้ยหนะมันได้อยู่แล้วครับ แต่เขียนยังไงนี่สิประเด็น จะเขียนยังไงคุณลองนึกดูก่อนครับ อิอิ เวลาเจอโจทย์แบบนี้มันก็รู้สึกเหมือนเรากำลังเล่นเกม Puzzle ดีๆ นี่เอง ลองหาวิธีผ่านด่านกันดูเองก่อนนะครับ แล้วค่อยดูเฉลยด้านล่างต่อไป บางทีคุณอาจจะเขียนไม่เหมือนผมก็ได้ แต่ถ้าได้ผลลัพธ์เช่นกันก็ไม่มีปัญหาอะไรครับ เพราะ 100 คนเขียนโปรแกรมออกมาเหมือนกันแต่ Code อาจจะไม่เหมือนกันเลยก็ได้นะครับเป็นเรื่องปกติธรรมดามาก



เฉลยๆๆ

ตัวอย่างหาค่า Triangular Number ขั้นที่ 1 ถึง ขั้นที่ n ด้วย for 

var n:int = 5;
for (var i:int = 1; i <= n; i++)
{
    var result:int = 0;
    for (var j:int = 1; j <= i; j++)
    {
        result += j;
    }
    trace("result for triangular number at " + n + " is = " + result);
}

ผลที่ได้

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

ก็คงจบเรื่อง for เท่านี้ก่อนนะครับ มาต่อการวนลูปด้วย while กันต่อเลยดีกว่าครับ

while

เริ่ม กันด้วยตัวอย่างอีกเช่นเคยครับ โดยผมจะให้ผลลัพธ์ที่ได้เป็นเหมือนกับตัวอย่างของ for นะครับ เพื่อจะได้เทียบกันแบบ shot ต่อ shot เลยว่า เขียนให้ได้ผลเหมือนกันโดยใช้ for กับ while มันเขียนต่างกันยังไงบ้าง


ตัวอย่าง while 1

var i:int = 0;
while (i < 10)
{
    trace("i = " + i);
    i++;
}

ผลที่ได้ 

ดูตัวอย่างที่ 2 ต่อกันเลยนะครับ

ตัวอย่าง while2

var i:int = 5;
while (i < 20)
{
    trace("i = " + i);
    i += 5;
}

ผลที่ได้

และต่อที่ตัวอย่างที่ 3 ครับ

 ตัวอย่าง while3

var i:int = 100;
while (i > 0)
{
    trace("i = " + i);
    i -= 10;
}

ผลที่ได้

สรุปสำหรับ while นั้น Syntax คือ


กำหนดค่าเริ่มต้นของตัววิ่งลูป;
while (ลูป Expression ที่ถ้าเป็น true จะทำต่อถ้าเป็น false จะออกจากลูป)
{
    statement ที่จะทำซ้ำ; 
    เพิ่มค่า(หรือลดค่า)ตัววิ่งลูป;
} 

เอา หละถ้าจะใช้  while เขียนหาค่า Triangular Number ดูหละ รวมถึงการใช้ while เขียนให้แสดงค่า Triangular Number ตั้งแต่ขั้นที่ 1 ถึงขั้นที่ n จะเขียนยังไง ผมให้เป็นแบบฝึกหัดลองเขียนกันดูนะครับ!!

do

สำหรับ do ลูป จะใกล้เคียงกับ while ลูปครับ หรือบางทีเค้าจะเรียกกันว่า do...while มากกว่า do เฉยๆ ซะอีกเพราะว่าเวลาเขียนจะใช้ Keyword ทั้ง do และ while ครับ

do ลูป จะทำการรัน Code ตรงส่วน statement ที่จะทำซ้ำก่อน แล้วค่อยตรวจสอบลูป Expression ที่ถ้าเป็น true จะวนลูปต่อถ้าเป็น false จะออกจากลูป ทีหลังครับ ซึ่งก็แตกจาก for และ while ด้วยเช่นกัน เพราะทั้ง for loop และ while loop จะทำการตรวจสอบลูป Expression ก่อน แล้วค่อยทำ statement ที่จะทำซ้ำ

ลองมาดูตัวอย่าง do กันครับ

ตัวอย่าง do 1

var hp:int = 50;
do
{
    trace("attack!");
    hp -= 10;
}
while (hp > 0)
trace("die...");

ผลที่ได้

ตัวอย่าง นี้แสดงถึง Syntax การเขียน do...while ครับ โดยที่มาถึงเราก็จะ attack! ก่อนเลย 1 ทีซึ่งจะทำให้ hp ลดลง 10 หลังจากนั้นถึงจะทำการตรวจสอบดูว่าอยากมันยังไม่ตาย (hp ยังมากกว่า 0 อยู่) ก็ให้ทำการวนลูปอัดซ้ำไปเรื่อยๆ จนกว่ามันจะตายนั่นเองครับ อิอิ โปรแกรมนี้โหดสะใจเลยใช่มั้ยครับ ฮ่าๆ

ส่วน ใหญ่แล้วเวลาเขียนโปรแกรมวนลูปเราก็ไม่มีข้อกำหนดตายตัวว่าจะต้องใช้ for, while หรือ do ครับ ขึ้นอยู่กับ Requirement หรือผลลัพธ์ของโปรแกรมที่เราต้องการ รวมถึงความถนัดและความชอบส่วนตัวมากกว่าว่าชอบใช้อะไรมากกว่ากัน ไม่มีผิด-ถูกครับ (แต่สำหรับการเป็นโปรแกรมเมอร์ระดับโปรหรือ Expert นั้นก็อาจจะมีการเขียน Code ที่เรียกว่าดีน้อยกับดีมากหรือดีเยี่ยมอยู่ครับ ไว้อนาคตค่อยพูดถึงครับ หากมีโอกาส)

อย่าง ไรก็ตามผมขอจบเรื่อง Program Looping ไว้เท่านี้ละกันนะครับ อาจจะพูดถึง while กับ do น้อยหน่อย แต่ Concept แล้วทั้ง for, while และ do ไม่ค่อยต่างกันมากครับ ยังไงคุณก็ "ลอง" เขียนเล่นเพื่อทำความคุ้นเคยกันดูละกันนะครับผม

ขอบคุณครับ ไว้พบกันใหม่ครับ ^^