เรื่องเริ่มจากตอนที่เลิกงานจู่ๆก็มีรถขายขนมเครปผ่านมาพอดีเลยแวะซื้อซักหน่อย

 

ระหว่างที่ซื้อมาแล้ว ก็พึ่งสังเกตเห็นว่ากระดาษห่อขนมนั้น “มีรอยประ”

 

 

ผมก็ยืนคิดอยู่พักหนึ่งว่ารอยประนี้ มีไว้เพื่ออะไร ตอนแรกก็คิดไว้ว่า น่าจะมีไว้ระบายความร้อนของตัวขนมหรือปล่าว?

 

ผมยืนนึกอยู่ประมาณ 5 วิ ก็คิดได้ ออ… มันมีไว้ฉีกออกเล่นเป็นตุ๊กตานี้เอง !!

 

ทันใดนั้นผมก็นึกถึงเรื่อง 1 ฟังชั่น = 1 จุดประสงค์ ของหนังสือเรื่อง Clean Code ของ Uncle Bob ที่กำลังศึกษาอยู่พอดี ซึ่งน่าจะเป็นตัวอย่างที่เห็นได้ชัดมากสำหรับหัวข้อนี้

จากรูปเราจะเห็นกระดาษห่อขนมเครป ถ้าถามว่าเอามาทำอะไร? แน่นอนอยู่แล้ว ทุกคนตอบได้ว่าก็ต้องเอามาใส่ขนมเครปสิ!!

 

 

แต่ถ้าหากเรามองเข้าไปในกระดาษ จะเห็นรอยประ ซึ่งผมเข้าใจว่าผู้ผลิตคงต้องการให้กินเสร็จ ก็สามารถฉีกออกมาเล่นเป็นตุ๊กตาได้ด้วย

 

ทีนี้กลับมาพูดถึงเรื่องการเขียนโค๊ด ถ้าเราสังเกตดีๆ ตัวโค๊ดของเราก็เปรียบเสมือนกับกระดาษห่อขนมเครปที่ผมถืออยู่นี้ชัดเลย

 

จะห่อขนมได้ดี หรือไม่ดี ก็ขึ้นอยู่กับตอนผลิตและตอนออกแบบฟังชั่นนี้ออกมา

 

บางทีเราคิดเผื่อไปว่า มันทำงานแค่ห่อขนมอย่างเดียวคงไม่พอหลอก เดียวจะไปเหมือนเจ้าอื่นๆ

 

งั้นเราออกแบบตัวการ์ตูนน่ารักๆ ทำรอยประเพิ่มไปด้วย เวลาเด็กๆกินเสร็จจะได้ฉีกเอาไปเล่นเป็นตุ๊กตาเป็นการลดขยะ … Genius !!!

 

 

แต่บางทีเราลืมคิดไปว่าถ้าเกิดเราประรอยไม่ดีพอ ถ้าเกิดซอสของขนมไหลจากตัวขนม มันไปโดนรอยประก็ทำให้กระดาษฉีก ซอสเลอะมือเปรอะเปื้อนไปหมดอีก!!

 

แทนที่มันจะทำงานเป็นถุงกระดาษใส่ขนมที่ดี ทีนี้มันก็เป็นไม่ได้ทั้งถุงใส่ซองขนม และ ฉีกเล่นเป็นตุ๊กตาที่เราคิดเผื่อมาไว้อย่างฉลาด มันก็ไม่ได้ สรุปพังหมด!!!

 

มันก็เหมือนกับตอนที่เราเขียนโค๊ด เช่น

 

plusNumber(a,b) { return a+b }

 

ทุกคนเข้าใจง่ายๆว่า คือบวกเลข

 

แต่ถ้าวันไหนเกิดคิดเผื่อ เอาไปใช้อย่างอื่นด้วยเช่น

 

                                                                                                  plusNumber(a,b) {
                                                                                                       if (a) {
                                                                                                           return Actions.push(“promotion_page”);
                                                                                                       }
                                                                                                       if (b) {
                                                                                                           return b;
                                                                                                       }
                                                                                                       return Actions.push(“cart_page”, a+b);
                                                                                                   }

 

แบบนี้ถ้าเป็นคนแก้โค๊ด แค่เห็นก็ปวดหัวแล้วใช่ไหมครับทุกคน ^^ คือไม่รู้จุดประสงค์ที่แท้จริงเอาไว้ทำอะไรกันแน่?

 

แล้วถ้าเราต้องการทำจริงๆ มันจำเป็นต้องมีแบบนี้จริงๆนะ เราควรทำยังไงดีให้เข้าใจและกลับมาแก้ง่าย?

 

เราสามารถทำได้โดยการแยกออกเป็นฟังชั่นใหญ่ แล้วเรียกหลายๆฟังชั่นเล็กๆ ที่เราสร้างไว้รออยู่แล้ว เช่น

 

                                                         const function calculatePrice(first_number,second_number,type) {
                                                                                             if (type === “plusNumber”) {
                                                                                                   return this.plusNumber(first_number,second_number);
                                                                                             } else if (type === “minusNumber”) {
                                                                                                   return this.minusNumber(first_number,second_number);
                                                                                             } else {
                                                                                                   return alert(“Sorry, this program only have plus and minus function);
                                                                                             }

 

แบบนี้ก็จะทำให้เวลากลับมาแก้โค๊ด สามารถแก้ได้ง่ายขึ้นโดยที่ไม่ต้องเดาว่ามันเอาไว้ทำอะไรกันแน่อีกแล้ว

 

ทั้งนี้สามารถเพิ่มเติมด้วยว่าตัวแปรที่เข้าไปใน function จะต้องกำหนด type ของตัวแปรเสมอ เช่น (“String”, “int”, “boolean”) แต่ทั้งนี้ยังไม่ขอพูดรายละเอียดอื่นๆเพิ่มไปอีก เพราะรู้สึกว่าพูดไปเยอะกว่านี้คนพึ่งเริ่มต้นการเขียนโค๊ดจะถอดใจ ไปทำอาชีพอื่นแทนซะก่อน

 

เพื่อนๆสามารถเรียนรู้หัวข้อนี้เพิ่มเติมได้โดย search หาคำว่า “ Clean Code “ ก็จะมีรายละเอียดมากมายพร้อมตัวอย่างให้เข้าใจมากขึ้น

 

เราจะได้ไม่เขียนโค๊ดเหมือนกับกระดาษห่อขนมเครปนี้ ที่เราต้องการให้ทำได้หลายอย่าง แต่สุดท้ายแล้ว เป็นอะไรไม่ได้เลย แม้กระทั่ง “กระดาษห่อขนมที่ดี”

 

หากมีข้อมูลตรงไหนที่อยากเสริมข้อมูลก็สามารถแนะนำผมได้ ผมจะได้รีบแก้ และเป็นความรู้สำหรับ เพื่อนๆ น้องๆ ที่กำลังศึกษาการเขียนโค๊ดครับผม หวังว่าบทความนี้จะมีประโยชน์ไม่มาก็น้อยนะครับ ขอบคุณที่อ่านจนจบครับ ^^