เมธอด HTML DOM console.trace()

เมธอด HTML DOM console.trace() ใช้สำหรับแสดงสแต็กทレース (stack trace) จนถึงจุดที่เมธอด console.trace() ถูกเรียกใช้ โดยพื้นฐานแล้วใช้สำหรับแสดงเส้นทางโค้ด คือโค้ดจบที่จุดนั้นอย่างไร

ไวยากรณ์

ไวยากรณ์สำหรับเมธอด console.trace() -

console.trace(label);

ที่นี่ label เป็นพารามิเตอร์ทางเลือกประเภท string เพื่อระบุป้ายกำกับสำหรับการติดตามโค้ด ช่วยได้หากมีการติดตามหลายอย่างสำหรับชิ้นส่วนโค้ดที่แตกต่างกัน

ตัวอย่าง

ลองดูตัวอย่างสำหรับเมธอด console.trace() -

<!DOCTYPE html> <html> <body> <h1> console.trace() Method</h1> <p>คลิกปุ่มด้านล่าง...</p> <button onclick="Function1()">Start Trace</button> <script> function Function1(){ Function2(); } function Function2(){ console.trace(); } </script> <p>ดูสแต็กทレースในคอนโซลหลังจากคลิกปุ่มข้างต้น</p> </body> </html>

ผลลัพธ์

จะได้ผลลัพธ์ดังนี้ -

เมื่อคลิกปุ่ม Start Trace และดูเอาต์พุตในแท็บคอนโซล -

ในตัวอย่างข้างต้น -

เราสร้างปุ่ม "Start Trace" ที่จะเรียกใช้ Function1() เมื่อถูกคลิกโดยผู้ใช้ -

<button onclick="Function1()">Start Trace</button>

Function1() จะเรียกใช้ Function2() และ Function2() จะเรียกใช้เมธอด console.trace() ที่อยู่ภายใน มันคือ stack trace ดังนั้นจะปฏิบัติตามลำดับ last-in first-out เนื่องจากเมธอด console.trace ถูกเรียกโดย Function2() มันจะเป็นตัวแรกที่ถูก pop

Function1() เรียกใช้ Function2() ดังนั้นจะเป็นตัวที่สองที่ถูก pop สุดท้าย เนื่องจาก Function1() ถูกเรียกโดยปุ่ม "Start Trace" เมื่อถูกคลิก จะเป็นตัวสุดท้ายที่ถูก pop หมายความว่าจะเป็นลำดับย้อนกลับของที่พวกเขาถูกเรียก -

<button onclick="Function1()">Start Trace</button> function Function1(){ Function2(); } function Function2(){ console.trace(); }