Screen Shot 2558-10-29 at 7.07.50 PM
ช่วงนี้ทำการ review code ของทีมพัฒนาบ้างเล็กน้อย
จึงมีคำแนะนำ สำหรับการ Refactor code
หรือปรับปรุงโครงสร้าง code ให้ดีขึ้น
ทั้งเรื่องของการตั้งชื่อและโครงสร้างที่เหมาะสม

โดยวิธีการพื้นฐานที่ง่ายสุด ๆ
สำหรับการ Refactor code คือ Compose Method

ดังนั้น มาทำความรู้จักกันหน่อยว่ามันเป็นอย่างไร ?

Compose Method คืออะไร ?

คือการแยกส่วนการทำงานต่าง ๆ ออกไปเป็น method เล็ก ๆ
แต่ละ method มีชื่อที่สื่อสารได้ชัดเจน
แต่ละ method มีการทำงานอย่างใดอย่างหนึ่ง

จากนั้นทำการรวม method เหล่านี้เข้าด้วยกัน
ซึ่งทำให้เราเข้าใจการทำงานหลัก ๆ ของ method นี้
เรียก method นี้ว่า Compose Method

ผลที่ได้คือ
ในระบบจะมี method เล็ก ๆ
ในระบบจะมี method ที่ทำงานอย่างใดอย่างหนึ่ง
มันน่าจะทำให้ code อ่านง่าย เข้าใจง่ายมากขึ้นนะ
รวมไปถึงการแก้ไข น่าจะง่ายขึ้นด้วย

อ่านไปแล้วน่าจะงงอย่างแน่นอน

ดังนั้นมาดูตัวอย่างดีกว่า

ลองคิดดูสิว่า ถ้า code ที่เราเขียน
มันมีหน้าตา เหมือน หนังสือที่เราอ่าน ดังรูป

insanely-simple-cover-500px

แต่ในความเป็นจริงนั้นกลับตรงข้ามโดยสิ้นเชิง

ตรงข้ามอย่างไรล่ะ ?
มาดูตัวอย่าง code กันดีกว่า
เป็นตัวอย่างง่าย ๆ ของการ validate ข้อมูลรูปภาพ
ที่ถูก upload เข้ามายังระบบงาน
ซึ่งเราพบเจอได้บ่อยมาก ๆ

คำถาม
สิ่งผิดปกติของ class ImageValidator มีอะไรบ้าง ?

บางคนอาจจะบอกว่า code มันทำงานได้ดีนะ
ไม่น่าจะผิดอะไร !!
ตอบเลยว่า ใช่ มันทำงานได้

แต่ลองมองดูใหม่ว่า
ใน method validate() นั้นมันทำงานอะไรบ้าง ?
ตอบได้เลยว่า มีการทำงานเยอะมาก ๆ
แถมซับซ้อนมากด้วย

ใคร ๆ มาอ่าน code ชุดนี้
น่าจะมีคิดในใจว่า แม่ง code ชุดนี้ใครเขียนว่ะ !!
… ฉิบหาย …

ดังนั้น ขอให้หายใจเข้าลึก ๆ

สูดอากาศเข้าไปให้เต็มปอด
จากนั้นเริ่มมาดูก่อนว่า
ใน method validate() นั้นมีการทำงานกี่ส่วน อะไรบ้าง ?

  1. ตรวจสอบค่าของ input
  2. ตรวจสอบว่า input เป็นรูปหรือไม่
  3. ตรวจสอบขนาดของรูปว่ามีความกว้าง และ ยาว ตามที่กำหนดไว้หรือไม่

เมื่อเราสามารถแบ่งการทำงานออกเป็นส่วน ๆ ได้แล้ว
จากนั้นให้ทำการ extract ส่วนการทำงานเหล่านั้น
ไปยัง method ใหม่ ซึ่งมันคือการ Refactor code ชื่อว่า Extract method

ประเด็นสำคัญมาก ๆ คือ ชื่อ method ใหม่นี่แหละ
ที่ต้องตั้งชื่อให้สื่อ ให้ชัด ถึงการทำงานของมัน
ตัวอย่างของชื่อทั้ง 3 method เป็นดังนี้

  1. isInputValid()
  2. isImage()
  3. validateImageSize()

ถ้ามันไม่ดี ก็แก้ไข และ ปรับปรุงได้
แต่ผมคิดว่า มันดีกว่าเดิมแน่นอน

โดยใน method validate() นั้นจะมีขั้นตอนการทำงาน
ตามการเรียกใช้งานทั้ง 3 method
ซึ่งเราเรียก method validate() ว่า Compose method นั่นเอง
code ที่ได้เป็นดังนี้

เพียงเท่านี้คุณก็ได้ทำการ refactor code ให้ดีขึ้นมาอีกขั้นแล้ว

สังเกตไหมว่า ?
code ใน method validate() หรือ Compose method นั้น
มันอ่าน และ ทำความเข้าใจง่ายขึ้น
แต่ละ method ย่อย ๆ อยู่ใน level เดียวกัน
เหมือนกับหนังสือที่เราอ่านเลย  *_*

วันนี้คุณทำการ Refactor code กันแล้วหรือยัง ?
ถ้ายัง มาเริ่มทำกันเถอะครับ

สุดท้ายขอสรุปอีกรอบว่า Compose Method นั้น

  • เป็นวิธีการที่เรียบง่ายมาก ๆ
  • เน้นเรื่องความเล็กของ method
  • ช่วยลดความซ้ำซ้อนของ code (Duplication code)
  • เรื่องการสื่อสารที่ชัดเจนของ code นั่นคือ ชื่อของตัวแปร, method, parameter มันต้องชัดเจน สื่อถึงหน้าที่การทำงานมัน
  • แต่ละ method ใน Compose method จะอยู่ใน level การทำงานเดียวกัน
  • วิธีการมันเรียบง่ายมาก ๆ แต่เชื่อสิว่า developer ส่วนมากมักไม่ยอมทำกัน !!

ปล. ถ้าใน class หนึ่งมี method เล็ก ๆ จำนวนมาก
แนะนำให้ทำการจัดกลุ่มของ method เหล่านั้นซะ
จากนั้นทำการ extract ไปยัง class ใหม่
ซึ่งการ refactor code นี้เรียกว่า Extract Class

Reference Websites
https://scrutinizer-ci.com/docs/refactorings/compose-method
http://www.slideshare.net/GeoffBurns/compose-method-1794204