ในโลก Debugging, Programmer คือ พระเจ้า ตอน console.log()

Aniroot Suya
Jul 25, 2017 · 3 min read

dev A : อยากรู้ค่าของตัวแปรนี้ทำไงดี ?
dev B : console.log, System.out.print ดิ…

หลายครั้ง เราเห็น code พวกนี้อยู่ใน source code
หลายครั้ง เราก็เขียนมัน แล้วลืมลบ
และหลายครั้งเราก็เผลอ commit มันขึ้นไปบน version control


เราเคยได้ยินคำว่า debugging หรือป่าว? เรารู้จักมันไหม?

debugging ในที่นี้ ผมจะขอพูดถึงเรื่องของ tool ที่ใช้ใน debugging ครับ ซึ่งผมคิดว่าหลายคนที่เป็น dev คงจะผ่านตามันกันบ้างแล้ว แต่น้อยคน(มั้ง)ที่จะใช้มันจริงๆในการ dev ปกติ ซึ่งปกติแล้วมันมักจะมีอยู่ตาม editor ต่างๆ ที่ใช้ในการ dev อยู่แล้ว

Debug in Visual Studio Code
Debug in Eclipse

Debug mode หรือ debug หรือ debugging mode ใน tool ต่างๆ มีความสามารถทำให้เราสามารถในการ ตรวจสอบตัวแปร ความคุมการทำงานของโปรแกรม ที่กำลังทำงานอยู่ และอื่นๆ มากมาย เดี๋ยวผมจะพาไปดู(เท่าที่ผมนึกออก) ใน debug mode ของ eclipse ซึ่งจะเป็นตัวอย่างของการ debug ในส่วนของ ภาษา JAVA ครับ

ในตัวของ eclipse นั้น debug จะจัดเป็น หนึ่งใน perspective ครับ ซึ่งเราสามารถกด open ขึ้นมาสำหรับคนที่ไม่เคยใช้

เข้าส่วน menu Windows > perspective > open perspective > Debug(ถ้ามี)
หรือถ้าไม่มีก็กดไป Other… ตามรูปครับ

จากนั้นก็เลือกเป็น Debug ตามรูป

และเราก็จะได้ debug perspective ขึ้นมาแล้ว


มาลอง debug กันเถอะ


หนึ่งในปัญหาที่มักจะเจอกันบ่อยๆ คือการ print อะไรบางอย่างขึ้นไปยังหน้า console เพื่อต้องการ check ค่านั้นๆ ว่ามันมีค่าตามที่เราคิดหรือป่าว เพื่อที่เราจะได้เขียนโปรแกรมของเราต่อไป แต่การพิม print ไปนั่น มักจะมีข้อเสียตามมาบ่อยๆ นั่นคือ

ลืมลบ!
แต่เดี๋ยวก่อน… ปัญหานี้จะหมดไปเมื่อคุณใช้ debug mode !!

จาก code เราจะเห็นว่า เราไม่มีทางรู้เลยว่า ค่าของ testVar นั้นเป็นเท่าไหร่ .. (ก็ System.out.println() ดิจบเลย นั่นไงกลับมาอีกแล้ว)

การตรวจสอบค่าใน debug mode นั้นง่ายมาก แต่ทุกการ debug มีข้อแม้ว่า ต้องเปิด debug นะ .. เริ่มจาก

วาง breakpoint ในจุดที่ต้องการ ในการวาง breakpoint นั้นเราจะทำการจุดที่เราต้องการให้ตัวโปรแกรม หยุด ณ ตำแหน่งของโคด้นั้นๆ

จากตัวอย่าง ผมทำการวางไว้ตรง บรรทัดที่ 8 เมื่อโปรแกรม run มาถึงจุดๆนี้ โปรแกรมจะทำการหยุด(หยุดยังไงรออ่านต่อ)

เอาหละ ทำการ debug กัน

run ใน mode debug

เมื่อทำการ run แล้ว เราจะเห็นได้ว่า โปรแกรมหยุดก่อนจะ run บรรทัดที่เราทำการ mark breakpoint ไว้

เอาหละ แล้วยังไงดี.. การตรวจสอบ การตรวจสอบค่าของตัวแปรต่างๆ มันก็ง่ายมากกกกก เพียงแค่ เอาเมาส์ไปชี้ ในตัวแปรที่ต้องการ

นี่ไงจบ .. แยกย้าย

แต่เดี๋ยวก่อน อย่าลืมนะว่า ค่า 0.0 นั่นไม่ได้หมายความว่าเป็นค่า random แล้ว เนื่องจาก มันเป็นค่าก่อนจะ run คำสั่งนั้นต่างหาก การที่เราจะเห็นค่าที่ random แล้วจำเป็นต้องให้ตัวโปรแกรมมัน run ไปคำสั่งนั้นก่อน แล้วทำไงให้มัน run คำสั่งนั้นหละ

ในการ run ใน mode debug แล้ว จะมีคำสั่งที่จะใช้บ่อยๆ ประมาณ 3 อัน ดังนี้

  1. step over (F6 eclipse) คือ การเลื่อนบรรทัดของโค้ด นั้นๆ
  2. step into (F5 eclipse) คือ การเลื่อนตำแหน่งไปอีก 1 ตำแหน่ง แต่จะพิเศษที่ว่า ถ้า ณ ตำแหน่งนั้นๆ เป็น method ที่โยงไปได้ มันจะเข้าไปหา method นั้นๆ
  3. resume (F8 eclipse) คือ การปล่อย ให้โปรแกรม run ต่อไป จนกว่าจะเจอ breakpoint ใหม่ หรือ ไม่ก็ ไปต่อเรื่อยๆ ถ้าไม่เจอ breakpoint เลย
ผลของการ step into มันจะวิ่งไปหา method random()

ซึ่ง ณ ตำแหน่งของก่อนที่ print จะ run นั้น แน่นอนว่า testVar นั้นย่อมถูก assign ค่าจาก method random แล้ว ทำให้เกิดค่าใหม่ ซึ่งแน่นอนว่าเมื่อเราเอาเมาส์ไปชี้ก็จะเป็นดังนี้

ซึ่งตรงการ ค่าที่ print ออกมา

ต่อไปนี้ ถ้าต้องการดูค่าจากตัวแปร อย่าลืม debug mode แทน print console นะครับ


นอกจากเมาส์ชี้แล้ว สามารถดูได้จาก variables นะครับ

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade