เปลี่ยนโค้ดยุ่งๆให้ดูง่าย ด้วย Facade Pattern

Facade คืออะไร

Facade เป็น Design Pattern ที่สร้าง interface อันแสนเรียบง่ายมาให้ใช้งาน library, framework หรือ class ที่มันซับซ้อน

ตัวอย่างในโลกแห่งความเป็นจริงที่เกี่ยวกับ Facade

จากรูป สมมติว่าเราต้องการซื้อสินค้าผ่านทางโทรศัพท์เราจะเริ่มจากโทรไปหา call center แล้ว ก็บอกว่า ต้องการซื้อสินค้า 1 ชิ้นครับ ราคาเท่านี้ มาส่งที่นี่ หลังจากนั้น ทาง call center ต้องติดต่อไป ยังคลังสินค้าเพื่อเช็คว่ามีของหรือเปล่า ติดต่อไปยังฝ่ายขายเพื่อเปิดออเดอร์ ติดต่อไปยังฝ่ายประกอบสินค้า เพื่อแพ็คสินค้า ติดต่อไปยังฝ่ายขนส่ง เพื่อมาส่งสินค้าให้เรา ในตัวอย่างนี้ call center เนี่ยแหละครับ คือ facade ของเรานั่นเอง ทำให้การสั่งสินค้าแต่ละครั้งเป็นไปด้วยความสะดวกสบาย เราไม่ต้องติดต่อไปยังฝ่ายต่างๆเอง

ลองมาดูตัวอย่างใน code กันบ้าง

Code ที่จะเห็นต่อไปนี้เป็น code ตัวอย่างที่อ้างอิงมาจาก code ที่ใช้งานจริง ดังนั้นจะตัดบางส่วนออก เช่น การ handle error เพื่อให้เข้าใจง่ายขึ้นครับ

ใน FlowAccount เวลาลูกค้าต้องการซื้อ package ของ FlowAccount ด้วย Credit Card เราจะมี class หลายๆอย่าง แต่ละอย่างทำหน้าที่แตกต่างกันไป เริ่มตั้งแต่

1. AccountService ไว้หา companyId ของลูกค้าที่ใช้งานอยู่
2. PaymentService ไว้ยืนยัน credit card และเก็บเงินลูกค้า
3. AutoRenewService ไว้ให้ระบบต่ออายุ package ของลูกค้าอัตโนมัติทุกๆเดือน

ทีนี้พอเรานำ class พวกนี้มาประกอบกัน เวลาลูกค้ากดชำระเงิน เราก็จะเขียน code ออกมาแบบนี้

เห็นไหมครับว่ากว่าจะเก็บเงินทีนึง เราต้องสร้างทุกๆ class แล้วก็หา companyId มาเก็บไว้ก่อน แล้วค่อยทำการยืนยันเลขบัตรเครดิตของลูกค้า จากนั้นจึงทำการจ่ายเงินผ่าน PaymentService แล้วค่อยทำให้ AutoRenew

พอใช้ Facade แล้วหน้าตา Code มันเปลี่ยนแปลงไปอย่างไรบ้าง

หลังจากที่เราลองนำ Facade มาใช้ เราจึงลองสร้าง Facade Object ชื่อว่า SubscriptionFacade แล้วจัดการ เอาทุกอย่างไปไว้ในนั้น หน้าตาก็จะออกมาแบบนี้

พอลูกค้าต้องการชำระเงิน เราก็นำ class ไปใช้แบบนี้

โอ้โห เห็นไหมครับ มันช่างง่ายแสนง่าย เอาทุกอย่างไปรวมๆกันไว้ใน class นึงทำ interface ออกมาแล้วก็ เรียกใช้งาน แต่ประเด็นมันมีอยู่ว่า….

แล้วที่ทำมาแบบนี้มันดีรึยัง แบบนี้ได้หรือเปล่า มีดีกว่านี้ไหม

จะเห็นว่าทุกอย่างมันเหมือนกับจะดี แต่ก็ยังมีอะไรแปลกๆ จริงๆแล้วไอ้เจ้า SubscriptionFacade เนี่ย มันไม่ควรมี AccountService อยู่รึเปล่า เพราะว่าแบบนี้จะกลายเป็นว่า SubscriptionFacade เรามันไปผูกอยู่กับ AccountService ผลที่ตามมาคือ Class SubscriptionFacade จะต้องรู้จักคลาสนี้ และต้องรู้ด้วยว่าต้องหยิบค่า companyId ไปส่งต่อให้กลับ autoRenewService อีกรอบ กลายเป็นว่า Facade ของเรามี Business Logic แทรกเข้าไปด้วย

ไหนๆก็ไหนๆแล้วเรามาลองแก้ไขดู

เริ่มจากการย้าย AccountService ออกมาจาก SubscriptionFacade หน้าตาก็จะประมาณนี้ครับ

ทีนี้เวลาเราเรียกใช้งาน ก็จะหน้าตาประมาณนี้

จะเห็นว่ามันเริ่มดีขึ้น เมื่อเราแยก AccountService ออกมาจาก SubscriptionFacade ทำให้ไอ้เจ้า SubscriptionFacade เนี่ยสามารถเรียกเก็บเงินจาก companyId อื่นได้ด้วย

มันก็เหมือนกับเวลาที่เราขับรถ แล้วเราเปลี่ยนเกียร์ ในการเปลี่ยนจากเกียร์ R เป็นเกียร์ D เนี่ย ภายในระบบ เกียร์มันทำงานหลายขั้นตอน แต่เราไม่จำเป็นต้องรู้ เรารู้แค่ว่าเปลี่ยนเป็นเกียร์ D แล้วเดินหน้า เปลี่ยนเป็นเกียร์ R ถอยหลัง เท่านี้เราก็ใช้งานได้ง่ายแล้ว แต่ว่าถ้าเกิดว่าเราเปลี่ยนเกียร์ แล้วพวงมาลัยหมุนด้วย มันก็ดูแปลกๆ ใช่ไหมครับ ดังนั้นศิลปะในการทำ Facade ก็คือการรวมสิ่งที่มีหน้าที่คล้ายกัน มาอยู่ด้วยกัน เพื่อให้ทำงานง่าย ขึ้นนั่นเอง

Facade Pattern เอาไว้ใช้แก้ปัญหาอะไร

Facade Pattern เอาไว้ใช้เพื่อเพิ่มความสะดวกสบายในการทำงาน โดยการสร้าง Facade Object เพื่อ จัดการกับระบบที่ซับซ้อนนั่นเอง

ข้อดี และข้อเสียของ Facade Pattern

ข้อดี

Facade Object ทำให้ผู้ใช้โค้ดของเราไม่ต้องไปยุ่งกับ code ที่ซับซ้อน ถ้าออกแบบไว้ดี เราสามารถปรับเปลี่ยนขั้นตอนในการทำ Subscription ข้างในได้ โดยผู้ใช้ไม่ต้องเปลี่ยนแปลงโค้ด

ข้อเสีย

ถ้าหากเรารวมอะไรหลายๆอย่างไว้ใน Facade Object เยอะๆ จะทำให้ Facade Object กลายเป็น God Object ที่มีขนาดใหญ่มาก ทำให้อ่านและแก้ไขโค้ดได้ยากขึ้น

สรุป How to Facade

1. ยุบรวม class ที่ซับซ้อนไว้ใน Facade Object (พยายามรวมแต่ชิ้นที่ทำหน้าที่เกี่ยวข้องกัน ไว้ด้วยกันนะ ครับ)
2. สร้าง interface ของ Facade Object เพื่อให้ง่ายต่อการเรียกใช้งาน
3. เคล็ดลับแต่ไม่ลับ ถ้า Facade Object มันเริ่มใหญ่เกินไป เราสามารถสร้าง Facade Object ใหม่จาก Facade Object เดิมได้ครับ

หากชอบบทความของ FlowAccount Tech Blog อย่าลืมกด Follow นะครับ ติดตามบทความอื่นจาก FlowAccount Tech Blog ได้ที่ https://medium.com/flowaccount-tech

Open Positions jobs available on FlowAccount > https://flowaccount.com/en/jobs