บทเรียนที่ 22 การกำหนดเงื่อนไข IF และ ELSE
บทที่แล้วเราใช้แต่คำสั่ง if แต่บทนี้เราจะใช้คำสั่ง else ร่วมด้วยครับ ซึ่งการใช้งานร่วมกัน โปรแกรมสามารถตัดสินใจได้ว่าจะทำอย่างไร ทั้งในกรณีที่เงื่อนไขถูก และในกรณีที่เงื่อนไขผิด(เป็นหน้าที่ของ else) ซึ่งจะทำให้คุณควบคุมโปรแกรมของคุณได้มากขึ้นครับ
สคริป...
<HTML><HEAD><SCRIPT type="text/javascript">function rand(){now=new Date()num=(now.getSeconds())%5num=num+1}function guessnum(){guess=prompt("โปรดพิมพ์เลข 1 ถึง 5")if (guess == num){alert("คุณทายถูก !!")rand()}else alert("ไม่ถูกครับ.. ลองใหม่")}</SCRIPT></HEAD><BODY onLoad="rand()"><CENTER><h2>ให้คุณทายเลข 1 ถึง 5</h1><FORM NAME="myform"><INPUT TYPE="button" VALUE="วัดดวง" NAME="b1" onClick="guessnum()"></FORM></CENTER></BODY></HTML>ผลของสคริปนี้
ให้คุณทายเลข 1 ถึง 5
มาแยกโครงสร้างของสคริปกันครับ
· เริ่มจากตอนแรกที่โหลดหน้านี้ขึ้นมา...
<BODY onLoad="rand()">
เห็นไหมครับ ว่าไม่จำเป็นต้องกดปุ่ม ก็สามารถเรียกชุดคำสั่งได้ ด้วยคำสั่ง onLoad ใน BODY นี่เอง เมื่อชุดคำสั่ง rand ทำงาน เลข 1 ถึง 5 จะถูกสุ่มขึ้นมาจากเวลาในตอนที่เปิดเข้ามานั้น แต่การสุ่มไม่ได้ทำแค่ครั้งแรกครั้งเดียว หลังจากทุกครั้งที่คุณทายเลข การสุ่มจะเริ่มใหม่อีกครั้ง
· มาดูในส่วนของชุดคำสั่งที่สุ่มเลขครับ...
function rand()
{now=new Date()
num=(now.getSeconds())%5
num=num+1}
{now=new Date()
num=(now.getSeconds())%5
num=num+1}
ชุดคำสั่งจะเลือกสุ่มจากเลข 1 ถึง 5 ที่ได้จากเวลาขณะที่ชุดคำสั่งทำงาน ซึ่งแทนค่าด้วย num เหมือนกับบทที่แล้วครับ
· เรามาดูชุดคำสั่งต่อมาครับ
function guessnum()
{guess=prompt("โปรดพิมพ์เลข 1 ถึง 5")
if(guess == num)
{alert("คุณทายถูก !!")
rand()}
else alert("ไม่ถูกครับ.. ลองใหม่")}
{guess=prompt("โปรดพิมพ์เลข 1 ถึง 5")
if(guess == num)
{alert("คุณทายถูก !!")
rand()}
else alert("ไม่ถูกครับ.. ลองใหม่")}
อันนี้เป็นการเขียนโปรแกรมที่ฉลาดทีเดียว Andree(ผู้เชี่ยวชาญจาวาสคริป ซึ่งเป็นผู้เขียนสคริปของตัวอย่างที่คุณเรียนเกือบทั้งหมดครับ)เป็นคนเขียนเอง มีตัวเลขที่เก็บไว้ในความจำของ Browser จากการทำงานของชุดคำสั่งที่แล้ว ชุดคำสั่งนี้ก็จะให้คุณเล่นเกมทายเลข... ลองมาดูสิ่งต่างๆที่เกิดขึ้นครับ
o ค่าของตัวแปร guess ถูกสร้างขึ้นจาก กล่องรับค่า prompt
o ต่อมาการทำงานของชุดคำสั่งเข้าสู่ประโยค if และ else
o ถ้าค่าของ guess (ตัวเลขที่คุณพิมพ์ลงในกล่องรับค่า) เท่ากับ ตัวเลขที่สุ่มไว้แล้ว(num) ข้อความ "คุณทายถูก !!" จะโผล่ขึ้นมา แล้วทำการสุ่มเลขอีกครั้งหนึ่ง (สังเกตที่ rand() วางไว้ในปีกกาเงื่อนไขถูก)
o แต่ถ้าทายไม่ถูก การทำงานของชุดคำสั่งจะไปต่อที่ else และบอกว่าคุณทายไม่ถูก... โปรแกรมลื่นไหลดีไหมครับ ?
· และส่วนสุดท้ายที่ตอนนี้ คุณคุ้นเคยแล้ว
<FORM NAME="myform">
<INPUT TYPE="button" VALUE="วัดดวง"
NAME="b1" onClick="guessnum()">
</FORM>
เป็นส่วนที่เรียกให้ชุดคำสั่งทำงาน เริ่มเกมทายเลข
<INPUT TYPE="button" VALUE="วัดดวง"
NAME="b1" onClick="guessnum()">
</FORM>
เป็นส่วนที่เรียกให้ชุดคำสั่งทำงาน เริ่มเกมทายเลข
แบบฝึกหัด
ผมนำความท้ายทายมาให้คุณอีกแล้วครับท่าน ! ให้คุณแก้ไขสคริปตัวอย่าง ให้สามารถบอกผู้ใช้ได้ว่า เลขที่ผู้ใช้ทาย สูงหรือต่ำกว่าเลขที่ถูกต้อง
คำใบ้ : ผลที่ออกมาในเกมจะมีเพียงสามทางครับ
คำใบ้ : ผลที่ออกมาในเกมจะมีเพียงสามทางครับ
1. สูงกว่า (สัญลักษณ์ใช้ว่า > )
2. ต่ำกว่า (สัญลักษณ์ใช้ว่า < )
3. หรือทายถูก (สัญลักษณ์ใช้ว่า == )
ลองคิดดูให้ดีครับว่า... คุณจำเป็นต้องกำหนดคำสั่ง else หรือเปล่า หรือว่าต้องใช้ if ให้มากขึ้น
ไม่มีความคิดเห็น:
แสดงความคิดเห็น