หน้าขาว (ที่ไม่ใช่หน้าคน) พูดเบาๆก็ขนลุก

ผมอยากจะจดบันทึกวีรกรรมของตัวเอง เพื่อเตือนใจตัวเอง หรือหากวีรกรรมของผมมีประโยชน์กับผู้อ่านก็จะดีใจเป็นอย่างมากครับ

เรื่องมีอยู่ว่าผมได้เขียนฟังก์ชันจัดการกับตัวเลขขึ้นมาหนึ่งฟังก์ชัน โดยฟังก์ชันนี้จะรับค่าตัวเลขที่มี type number แล้วจะทำการ return ตัวเลขที่มี “,”(comma) ออกมา เช่น ถ้าผมส่งค่า 1000.00 จะต้องได้ 1,000.00

ฟังดูแล้วไม่น่าจะมีอะไรยาก ผมก็เข้า Google อย่างมั่นใจ (ตามแนวทาง Google and Stackoverflow developer 😂 5555) ซึ่งผมก็ได้เลือกเอา Answers ที่มีคนโหวตสูงที่สุด กว่า 3,904 โหวต ในขณะนั้น

javascript — How to format a number with commas as thousands separators? — Stack Overflow

พอนำฟังก์ชันมาใช้ ตัวโค๊ดก็ทำงานได้ปกติดี ผมส่งค่า 1000.00 ก็ได้ 1,000.00 ตามต้องการ คราวนี้ก็หมูหวานหวานหมูแล้วครับพี่จี้ ผมก็ commit and push ตามปกติ แล้วก็รอ pipeline ตามปกติ และ ทดสอบผ่าน web browser … จบปิ้ง 🥰

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

ระหว่างนั้นครุ่นคิดกับตัวเองว่า สาเหตุมาจากสิ่งไหนนะ และด้วยความที่เวลาผ่านมาสักพักใหญ่แล้วเลยทำให้ตี scope สาเหตุลำบาก พอเริ่มทำงานผมก็ได้เล่าปัญหาและขอความช่วยเหลือพี่ๆในทีม ซึ่งเจอว่าโทรศัพท์ของคนอื่นๆเข้าใช้งานได้ตามปกติ มีแต่เครื่องของผมที่เป็น IPhone 7+ ที่มีปัญหา เลยสงสัยว่าจะเป็นที่ version ของ os จากนั้นผมเลือกที่จะทำการย้อน commit ตามหาว่าอาการนี้เกิดขึ้นที่ commit ไหน

ผมก็ย้อน commit จนได้ว่า น่าจะเป็นที่ commit ของฟังก์ชัน number with comma นี่แหละ พี่ๆเลยแนะนำว่าให้ลองนำเอา *Regular expressions (Regex)ไปทดสอบในเว็บไซต์ [RegExr: Learn, Build, & Test RegEx](https://regexr.com/)* ผลคือ

ภาพจาก RegExr: Learn, Build, & Test RegEx

เป็นที่ชัดเจนว่า “?<!” ( Lookahead assertion) ของ Regex อาจจะไม่ซัพพอร์ตแล้ว 😭 ผมทำการแก้ไขโค๊ดตามคำแนะนำของพี่ๆ โดยไปใช้ .toLocaleString() แทน (ง่ายกว่าเดิม 55555) ซึ่ง .toLocaleString() เป็น Instance methods ของ javascript อยู่แล้ว ดีงามมากครับ และซัพพอร์ตทุก browser ด้วย

ภาพจาก developer.mozilla.org

สิ่งที่ได้จากเหตุการนี้

• ต่อให้ Answers จะโดนโหวตมากที่สุดก็อย่าเชื่อ ควรอ่านคอมเมนต์อื่นๆ เพราะบางทีมีคนเตือนแล้วว่าอย่าใช้
• ได้รู้จัก .toLocaleString() ของ javascript และจะไม่ลืม
• พยายามอย่าใช้ Regex หากไม่จำเป็น หรือ ไม่ศึกษาทำความเข้าใจก่อน
• RegExr: Learn, Build, & Test RegEx สามารถเช็คคุณภาพของ Regex ได้
• developer.mozilla.org สามารถกดขยายเพื่อดูปีที่เริ่มใช้งานได้ 😱
• Lookbehind in JS regular expressions | Can I use… Support tables for HTML5, CSS3, etc เป็นอีกแหล่งที่เช็ค supported versions ได้