หลายปีที่ผ่านมานักพัฒนาซอฟต์แวร์เป็นจำนวนมากได้นำวิธีการพัฒนาซอฟต์แวร์ที่เรียกว่า Test-Driven Development (TDD) มาใช้กันอย่างแพร่หลาย โดยหลักการของ TDD ก็คือ เป็นการพัฒนาซอฟต์แวร์ที่ใช้ การทดสอบโปรแกรมแบบอัตโนมัติ (Automated Unit Test) เป็นตัวขับเคลื่อน ผลักดันกระบวนการพัฒนาซอฟต์แวร์ เป็นการพัฒนาซอฟต์แวร์โดยการเขียนโค้ดที่ใช้ทดสอบการทำงานของตัวโปรแกรม (Unit Test) ก่อนที่จะเขียนโค้ดการทำงานของโปรแกรมจริงๆ ซึ่งมี 3 ขั้นตอนดังนี้
- Red - เขียนโค้ดที่ใช้ทดสอบการทำงานของโปรแกรมก่อนที่จะเขียนโค้ดการทำงานของโปรแกรม และให้การทดสอบทุกอันได้ผลลัพธ์ไม่ผ่านการทดสอบ
- Green - เขียนโค้ดการทำงานของโปรแกรมในผ่านการทดสอบ โดยเขียนโค้ดเท่าที่จำเป็นเพื่อให้ผ่านการทดสอบเท่านั้น
- Refactor - ปรับปรุงโค้ดที่เราเขียนในขั้นตอนที่ 2 ให้ดีขึ้น เช่น ลดโค้ดที่ซ้ำซ้อน หรือ ลดจำนวนโค้ดที่เขียนขึ้นแต่ทำงานได้เท่าเดิม เป็นต้น หลังจากที่ปรับปรุงโค้ดแล้ว ก็ให้ทำการทดสอบทุกครั้ง เพื่อให้แน่ใจว่าโค้ดที่ปรับปรุงไม่กระทบการทำงานของโปรแกรมและยังทำงานได้ตามปกติ
จากขั้นตอนข้างต้นเราจะมาเริ่มเขียนโค้ดทดสอบคลาส JsgeObject กัน ถึงแม้นว่าเราจะข้ามขั้นตอนแรกไปเนื่องจากเราเขียนโค้ดของคลาส JsgeObject ไว้ก่อนแล้ว ก็ให้ทำเป็นเหมือนว่าเรายังไม่ได้เขียนโค้ดมาก่อน เวลาที่เราคิดว่าจะทดสอบอะไรบ้างนั้น ความคิดของเราจะได้ไม่โดนจำกัดด้วยโค้ดที่เราเขียนขึ้นไว้ก่อนหน้านี้แล้ว
การพัฒนาซอฟต์แวร์แบบ TDD มีข้อดีก็คือ ทำให้เราได้โค้ดที่สามารถทดสอบได้ โค้ดที่เขียนขึ้นค่อนข้างตรงกับมุมมองของผู้ใช้งาน เนื่องจากเราต้องเขียนการทดสอบก่อนว่าจะใช้งานโค้ดส่วนนั้นอย่างไร และการทดสอบที่เราเขียนขึ้นอ้างอิงจากการใช้งานของผู้ใช้เป็นหลัก และสุดท้ายเวลาที่เราปรับปรุงโค้ด เราสามารถที่จะทำการทดสอบได้อย่างรวดเร็วว่าโค้ดยังทำงานถูกต้องหรือไม่ ด้วยการทดสอบแบบอัตโนมัติช่วยลดเวลาในการทำงาน
เรามาเริ่มต้นเขียนการทดสอบโค้ดกัน โดยเราจะใช้วิธีที่ง่ายที่สุดก่อน ก็คือใช้ if-statement ในการทดสอบดังตัวอย่างข้างล่าง และหลังจากนั้นเราจะแสดงการใช้ Unit Test Library ที่ชื่อ QUnit แทนที่จะใช้ if-statment ในการทดสอบโค้ด
var jsgeObj = new JsgeObject(10, 20);
jsgeObj.setData("hero");
if(jsgeObj.getX() != 10) {
document.write("the x pos must be 10");
}
if(jsgeObj.getY() != 20) {
document.write("the y pos must be 20");
}
if(jsgeObj.getData() != "hero") {
document.write("the data must be hero");
}
จากโค้ดเราจะเริ่มต้นด้วยการสร้างอ๊อปเจ็กของ JsgeObject โดยให้ตำแหน่ง X และ Y อยู่ที่ 10 และ 20 ตามลำดับ และก็กำหนดให้ data เป็นคำว่า hero โดยการเรียก jsgeObj.setData("hero") หลังจากนั้นเราก็ตรวจสอบว่าตำแหน่ง X Y และ data ที่เรากำหนดไว้นั้นถูกต้องหรือไม่ โดยการใช้ if-statement ทดสอบค่าที่ได้จาก getX() getY() และ getData() ตามลำดับ ถ้าค่าที่ได้ไม่ตรงกับที่เรากำหนดไว้ก่อนหน้านี้ เราก็จะพิมพ์ข้อผิดพลาดออกทางหน้าจอโดยเรียก document.write(...)
การเขียนโค้ดทดสอบจะทำให้เราแน่ใจได้ว่าโปรแกรมทำงานได้อย่างถูกต้องและช่วยลดเวลาที่เราต้องทดสอบโค้ดอีกครั้งหนึ่ง ถ้าเราทำการแก้ไขปรับปรุงโค้ดในอนาคต เพียงแค่รันโค้ดที่ใช้ในการทดสอบอีกครั้งว่าผ่านการทดสอบหรือไม่
ในบทความถัดไปเราจะมาพูดถึง Library ที่ใช้ในการเขียนโค้ดทดสอบการทำงานของโปรแกรมที่ชื่อ QUnit กันและโค้ดเพิ่มเติมที่เราจะเขียนเพิ่มเข้าไปในเกมส์เอ็นจิ้นเพื่อใช้ในการแสดงผลกราฟฟิกในเว็บบราวเซอร์กัน ขอให้สนุกกับการเขียนโปรแกรมนะครับ :)
การพัฒนาซอฟต์แวร์แบบ TDD มีข้อดีก็คือ ทำให้เราได้โค้ดที่สามารถทดสอบได้ โค้ดที่เขียนขึ้นค่อนข้างตรงกับมุมมองของผู้ใช้งาน เนื่องจากเราต้องเขียนการทดสอบก่อนว่าจะใช้งานโค้ดส่วนนั้นอย่างไร และการทดสอบที่เราเขียนขึ้นอ้างอิงจากการใช้งานของผู้ใช้เป็นหลัก และสุดท้ายเวลาที่เราปรับปรุงโค้ด เราสามารถที่จะทำการทดสอบได้อย่างรวดเร็วว่าโค้ดยังทำงานถูกต้องหรือไม่ ด้วยการทดสอบแบบอัตโนมัติช่วยลดเวลาในการทำงาน
เรามาเริ่มต้นเขียนการทดสอบโค้ดกัน โดยเราจะใช้วิธีที่ง่ายที่สุดก่อน ก็คือใช้ if-statement ในการทดสอบดังตัวอย่างข้างล่าง และหลังจากนั้นเราจะแสดงการใช้ Unit Test Library ที่ชื่อ QUnit แทนที่จะใช้ if-statment ในการทดสอบโค้ด
var jsgeObj = new JsgeObject(10, 20);
jsgeObj.setData("hero");
if(jsgeObj.getX() != 10) {
document.write("the x pos must be 10");
}
if(jsgeObj.getY() != 20) {
document.write("the y pos must be 20");
}
if(jsgeObj.getData() != "hero") {
document.write("the data must be hero");
}
จากโค้ดเราจะเริ่มต้นด้วยการสร้างอ๊อปเจ็กของ JsgeObject โดยให้ตำแหน่ง X และ Y อยู่ที่ 10 และ 20 ตามลำดับ และก็กำหนดให้ data เป็นคำว่า hero โดยการเรียก jsgeObj.setData("hero") หลังจากนั้นเราก็ตรวจสอบว่าตำแหน่ง X Y และ data ที่เรากำหนดไว้นั้นถูกต้องหรือไม่ โดยการใช้ if-statement ทดสอบค่าที่ได้จาก getX() getY() และ getData() ตามลำดับ ถ้าค่าที่ได้ไม่ตรงกับที่เรากำหนดไว้ก่อนหน้านี้ เราก็จะพิมพ์ข้อผิดพลาดออกทางหน้าจอโดยเรียก document.write(...)
การเขียนโค้ดทดสอบจะทำให้เราแน่ใจได้ว่าโปรแกรมทำงานได้อย่างถูกต้องและช่วยลดเวลาที่เราต้องทดสอบโค้ดอีกครั้งหนึ่ง ถ้าเราทำการแก้ไขปรับปรุงโค้ดในอนาคต เพียงแค่รันโค้ดที่ใช้ในการทดสอบอีกครั้งว่าผ่านการทดสอบหรือไม่
ในบทความถัดไปเราจะมาพูดถึง Library ที่ใช้ในการเขียนโค้ดทดสอบการทำงานของโปรแกรมที่ชื่อ QUnit กันและโค้ดเพิ่มเติมที่เราจะเขียนเพิ่มเข้าไปในเกมส์เอ็นจิ้นเพื่อใช้ในการแสดงผลกราฟฟิกในเว็บบราวเซอร์กัน ขอให้สนุกกับการเขียนโปรแกรมนะครับ :)
ไม่มีความคิดเห็น:
แสดงความคิดเห็น