วิธีเปิด JavaScript Debugger ใน Google Chrome

เปิด JavaScript Debugger ใน Chrome ได้ 2 วิธีหลัก:

วิธีที่ 1: Keyboard Shortcut (เร็วที่สุด)

• Ctrl + Shift + J (Windows/Linux)
• Cmd + Option + J (Mac)

→ เปิด DevTools ที่แท็บ Console ทันที

วิธีที่ 2: เมนู Chrome

1. คลิกเมนู ⋮ (Three dots) มุมขวาบน
2. เลือก More Tools → Developer Tools

แท็บที่สำคัญสำหรับ Debugging

Debugging Workflow พื้นฐาน

1. เปิดแท็บ Sources
2. หาไฟล์ JS ใน File Navigator (ซ้าย) หรือกด Ctrl+P ค้นหาไฟล์
3. คลิกหมายเลขบรรทัดเพื่อตั้ง Breakpoint (จุดแดง)
4. Reload หน้าเว็บหรือ Trigger Event
5. โค้ดหยุดที่ Breakpoint → ดู Scope Variables, Call Stack
6. ใช้ Toolbar: F8 Resume, F10 Step Over, F11 Step Into, Shift+F11 Step Out

แหล่งข้อมูลอย่างเป็นทางการ

• Chrome DevTools Docs: https://developer.chrome.com/docs/devtools/
• JavaScript Debugging Guide: Debug JavaScript

หมายเหตุ: รูปภาพในต้นฉบับแสดงเมนู More Tools > Developer Tools

เอกสารการจัดรูปแบบวันที่ (Date Formatting) ใน JavaScript อยู่ที่ไหน

วิธี Execute JavaScript Function จากชื่อในตัวแปร