Debug – สกัดจุดหยุด Code ด้วย Break Point

ถ้าถามว่าจะเริ่ม Debug โปรแกรมต้องทำอะไรบ้าง ทุกๆคนจะตอบเป็นเสียงเดียวกันว่าไปใส่ Break Point ไว้ใน Code ตรงบรรทัดที่เราต้องการให้ Code หยุดการทำงาน

การใส่ Break Point ก็ทำได้ตามนี้ครับ คือ

  1. คลิ๊กที่พื้นที่หน้า Code บริเวณที่ล้อมกรอบสีแดง ถ้าสำเร็จแล้วจะมี จุดสีแดงขึ้น (คลิ๊กอีกทีเพื่อเอา Break Point ออก)

breakpoint1.png

2. หรือจะใช้ Hot Key ก็ได้ (ปกติของ Visual Studio คือ F9)

breakpoint2.png

เริ่มได้
จากนั้นลอง Run โปรแกรมแบบ Debug เช่นกด F5 ครับ เราจะเห็นว่าเมื่อ Code ทำงานมาถึงบรรดัดที่เราตั้ง Break Point ไว้มันก็จะหยุดเป็นลูกศรสีเหลืองๆ ซึ่งหมายถึงตอนนี้ Code กำลังทำงานอยู่ที่บรรทัดที่ 9

breakpoint3

ถ้าเรามีหลาย Break Point ทำการกด F5 นั้นจะเป็นการสั่งให้ Code ทำงานต่อจนไปถึง Break Point จุดถัดไปนะครับ

แล้วจะ Break ไปทำไมกัน มันมีประโยชน์แน่นอนครับ ถ้า Code ของเรามีตัวแปรเราสามารถเอา Mouse ไปจิ้มดูได้ครับแล้ว Debugger ก็จะโชว์ค่าของตัวแปร

ตัวอย่างเช่น

breakpoint4

Console.ReadLine() ทำการรับข้อมูลจาก User ซึ่งผมพิมพ์ “hey anurocha” ไป แล้วเก็บค่าใส่ตัวแปรชื่อ input ผมสามารถเอา Mouse ไปจิ้มตรง input แล้วจะเห็นว่าตัวแปรนี้เป็นค่า “hey anurocha” อยู่

ที่นี้ถ้าโปรเจคเราใหญ่มากแล้วเราทำการตั้ง Break Point ไว้หลายที่ หลายไฟล์เราจะจำได้มั้ย ซึ่งก็จะมี Break Point Window อยู่ครับ

breakpoint5.png

ซึ่งจะเห็นหน้าต่างสำหรับจัดการ Break Point ทั้งหมดของโปรเจคนี้ครับ เช่น
– เปิด/ปิด
– เซฟ หรือ Export/Import

breakpoint6.png

ซึ่งเราสามารถที่จะปิด Break Point ได้โดยที่เรายัง Mark ตำแหน่งไว้จาก Check Box ทำให้เวลา Code ที่ทำงานจะไม่หยุดตรงจุดนั้นๆ

breakpoint7.png

จบ…(เรื่องพื้นฐาน)

มาต่อกันที่ระดับ Advanced ขึ้นนิดนึงครับ 
ปกติแล้ว Break Point ที่เราตั้งเนี่ยจะทำให้ Code หยุดทุกครั้งที่บรรทัดนั้นเรียก แล้วถ้าเราอยากให้มันหยุดเฉพาะบางกรณีล่ะ

ทำได้ครับ มีทางเลือกง่ายๆ คือทำการ Right Click ที่ Break Point นั้นๆ จะมี Conditions..เมนูให้เลือก

breakpoint8.png

ปกติผมใช้ Condition Expression กับ Hit Count ครับ

breakpoint9.png

  1. Condition Expression – เราสามารถกำหนดได้ว่าจะให้ Code มันหยุดตอนไหนบ้างโดนใส่ expression เหมือนใน if() เช่น ถ้าเรามี loop ที่ทำงาน 100 รอบ แล้วเราต้องการให้หยุดตอน i==10 ก็ใส่ไปแบบนี้
    breakpoint10.png
  2. Hit Count – กรณีเช่นเรามีปัญหาว่า Code จุดนี้รัน 30 ครั้งแล้วมันถึงมีปัญหา ถ้าเรา Break แบบปกติมันจะหยุดทุกครั้งซึ่งจะทำให้เราทำงานช้า เราก็สามารถกำหนดไปเลยว่า ขอหยุดเมื่อมันมารันครั้งที่ 30breakpoint11.png

เมื่อ Break Point มีการตั้งเงื่อนไขขึ้นสัญลักษณ์ก็จะเปลี่ยนไปเป็น

breakpoint12.png

ใช้กับ Google Chrome ก็ได้นะ

breakpointchrome.png

แล้ว Break Point เก็บไว้ที่ไหน????
หลายๆท่านอาจจะงงว่า เราตั้ง Break Point ไว้แล้วปิด Visual Studio ไปแล้วพอเปิดใหม่ Break Point ที่เคยตั้งไว้ก็กลับมาด้วย แต่พอไปเปิดเครื่องอื่นกลับไม่มา

สำหรับ Visual Studio นั้น โดยทั่วไป Break Point นั้นไม่ได้เป็นส่วนหนึ่งของไฟล์ในโปรเจค ทำให้เวลาที่เราแก้ไขมันแล้วเราเอาไฟล์ขึ้น Repository ต่างๆเช่น Git/SVN) คนอื่นจะไม่เห็น

ซึ่งไฟล์ของมันเก็บไว้ที่นี่ “.vs”
breakpoint13.png

ลองเข้าไปดู เจอไฟล์ .suo แต่เปิดไม่ได้…

breakpoint14.png

ลองใช้ 7z เปิดดูก็พอเดาได้ว่าข้อมูลการตั้ง Break Point อยู่ในนี้แหละครับ

breakpoint15.png

เป็นอันจบหลักสูตรพื้นฐานวิชาสกัดจุดครับ HAPPY DEBUGGING

Debugging Series:

Advertisements

3 thoughts on “Debug – สกัดจุดหยุด Code ด้วย Break Point”

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s