กระดาษห่อขนมเครป และการเขียนโค๊ด

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

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

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

ผมยืนนึกอยู่ประมาณ 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 “ ก็จะมีรายละเอียดมากมายพร้อมตัวอย่างให้เข้าใจมากขึ้น

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

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

 

 

สำหรับท่านที่ต้องการทำ แอพ E-Commerce , App ช้อปปิ้ง หรือ แอพ Delivery แล้วล่ะก็ เราขอแนะนำ บริษัท SC-Spark Solution  บริษัท รับทำแอป เป็นบริษัทที่รับทำแอพพลิเคชั่น ที่มากประสบการณ์ โดยมีประสบกาณ์โดยตรงจาก Silicon Valley เป็นบริษัทผู้พัฒนาแอปพลิเคชั่นมากกว่า 100 บริษัททั่วโลก ทั้งแบบ Custom และ สำเร็จรูปให้คุณได้เลือกใช้ หากใครสนใจ บริการทำโมบายแอพพลิเคชั่น หรือ เว็บไซต์ สามารถติดต่อได้ที่นี่  

ติดต่อเราได้ที่

โทร : 062-974-9495

Line : @scspark

Email : [email protected]

Facebook : SC-Spark Solution บริการทำแอปพลิเคชั่น

“Nothing is impossible”