วันพฤหัสบดีที่ 17 กรกฎาคม พ.ศ. 2557

ภาษา JavaScript ฉบับผู้เริ่มต้น part 8-2

: Condition Statement กับคำสั่ง switch statement

>> จาก part ที่ 8-1 เรื่องของ if-else-if statement คราวนี้เพื่อนๆจะได้รู้จักกับ switch statement ซึ่งมีลักษณะการทำงานแทบไม่ต่างจาก if-else-if statement เลย โดยมีโครงสร้างดังนี้

switch ( expression ) {
case value1 : break;
case value2 : break;
default :
}

เงื่อนไขหรือ expression ของ switch จะเทียบค่าว่าตรงกับค่า value ใดในแต่ละ case (จะเขียนกี่ case ก็ได้นะ) เปรียบดั่งเขียน else if ( expression ) นั่นแหละจ๊ะ เมื่อค่าของ expression ตรงกับค่าของ value ใดๆในแต่ละ case แล้วไซร้ การกระทำคำสั่งก็จะเริ่ม ณ จุดนั้น (หลังเครื่องหมาย : ) เป็นต้นไปจวบกระทั่งพบคีย์เวิร์ด break ก็จะหลุดออกจาก switch แต่หากไม่เข้า case ใดเลยก็จะไปกระทำคำสั่งใน default แทน ซึ่งเปรียบดั่งเขียน else นั่นเอง

>> ฟังแล้วงงเพราะยังไม่ค่อยชิน พาทำตัวอย่างหน่อยสิ
ตอบ จัดไป

var today = new Date();
var day = today.getDay();
switch(day) {
case 0 : day = "Sunday"; break;
case 1 : day = "Monday"; break;
case 2 : day = "Tuesday"; break;
case 3 : day = "Wednesday"; break;
case 4 : day = "Thursday"; break;
case 5 : day = "Friday"; break;
case 6 : day = "Saturday"; break;
}
alert("This day is " + day);

จากตัวอย่างข้างต้น เราสร้างออบเจ็กต์ Date ขึ้นมาโดยคำสั่ง new Date (งงหรือสงสัยข้ามไปก่อน เอาเป็นว่าให้ใช้แบบนี้เวลาสร้าง Date) ค่าของมันเก็บไว้ในตัวแปรชื่อ today ซึ่งอ้างอิงตามวันและเวลาของเครื่องคอมฯของเพื่อนๆ และเมื่อเราเอา today มาดอท (.) กับ getDay ก็จะได้ตัวเลขออกมา ซึ่งมีค่าอยู่ระหว่าง 0 ถึง 6 เราก็เลยไปตั้ง case ค่าของตัวเลข 0 ถึง 6 เพื่อเปลี่ยนค่าของตัวแปร day เป็นสตริงใดๆที่มีความหมายกับตัวเลขนั้นๆ ตัวอย่างเช่น วันนี้เป็นวันจันทร์ (ณ ขณะนี้) ค่าของ day ก็จะได้เท่ากับ 1 เมื่อนำเลขนี้ไป switch กับ case ใดๆก็เท่ากับ case 1 : ซึ่งทำคำสั่ง day = "Monday" (ตอนนี้เลข 1 ที่เคยเก็บไว้ในตัวแปร day หายไปแล้ว โดยมี "Monday" เก็บเอาไว้แทน) จากนั้นเจอคำสั่ง break โปรแกรมก็จะหลุดออกจาก switch ไปทำคำสั่ง alert ต่อไป

สามารถอ่านเกี่ยวกับ Date เพิ่มเติมได้จาก
http://www.tizag.com/javascriptT/javascriptdate.php

>> ฉันไม่เห็นการใช้ default เลย สรุปว่าใส่หรือไม่ใส่?
ตอบ ตาแหลมมากครับ คำสั่ง default จะใส่หรือไม่ใส่ก็ได้ ขึ้นอยู่กับว่าเราทราบค่าที่แน่นอนของ switch หรือเปล่า ถ้าทราบไม่ต้องใส่ครับ (ไวยากรณ์ไม่บังคับ) แต่ถ้าไม่ทราบสมควรใส่ไว้ จะได้รู้ไงว่าไม่มี case ใดๆสามารถทำตาม switch ได้เลย ดังตัวอย่างผมทราบว่าค่าของ getDay คือ 0 ถึง 6 ไม่มีค่าอื่นนอกจากนี้อีกแล้ว ดังนั้นละ default ได้อย่างสบายใจ แถมให้นิด~ คำสั่ง default ไม่จำเป็นต้องใส่ break ต่อท้ายนะครับ (ไวยากรณ์ไม่บังคับ)

>> ขอตัวอย่างที่ต้องใช้ default หน่อยสิจ๊ะ?
ตอบ จัดไปครับตามรูปภาพเลย โดยคำสั่ง prompt คือการรับข้อมูลผ่านกล่องลอย (ผมเรียกมันอย่างนี้นะ) แล้วเก็บค่าที่รับมาไว้กับตัวแปรชื่อ userInput ซึ่งจะมีไทป์เป็นสตริง เปลี่ยนค่าสตริงเป็นตัวเลขก่อนด้วย parseInt (เปลี่ยนค่าใดๆเป็น Number) จากนั้นนำค่าที่ได้ไปใช้กับ switch เหมือนตัวอย่างก่อนหน้านี้


>> ใน part 9 ต่อจากนี้ ขอนำเพื่อนๆเขียนภาษาจาวาสคริปต์ควบคุมการกดปุ่มที่แป้นพิมพ์ครับ เพื่อที่จะสลับรูปภาพจากรูปหนึ่งสู่อีกรูปหนึ่ง ไว้เจอกันนะค๊าบบบ

อ่านเกี่ยวกับคำสั่ง parseInt เพิ่มเติม
http://www.w3schools.com/jsref/jsref_parseint.asp

ไม่มีความคิดเห็น:

แสดงความคิดเห็น