השהיית הקוד עם נקודות עצירה (breakpoint)

Kayce Basques
Kayce Basques
Sofia Emelianova
Sofia Emelianova

משתמשים בנקודות עצירה כדי להשהות את קוד ה-JavaScript. במדריך הזה מוסבר על כל סוג של נקודת עצירה שזמינה ב-DevTools, ומוסבר מתי כדאי להשתמש בכל סוג ואיך מגדירים כל סוג. במאמר תחילת העבודה עם ניפוי באגים ב-JavaScript בכלי הפיתוח ל-Chrome מופיע מדריך אינטראקטיבי לתהליך ניפוי הבאגים.

סקירה כללית על הזמנים שבהם כדאי להשתמש בכל סוג של נקודת עצירה

הסוג הידוע ביותר של נקודת עצירה הוא נקודת עצירה בשורת קוד. עם זאת, הגדרת נקודות עצירה בשורת קוד יכולה להיות לא יעילה, במיוחד אם אתם לא יודעים בדיוק איפה לחפש או אם אתם עובדים עם בסיס קוד גדול. כדי לחסוך זמן בניפוי באגים, כדאי לדעת איך ומתי משתמשים בסוגי נקודות העצירה האחרים.

סוג נקודת העצירה (breakpoint)כדאי להשתמש באפשרות הזו אם רוצים ...
Line-of-codeהשהיה באזור מדויק בקוד.
שורת קוד מותניתהשהיה באזור מדויק בקוד, אבל רק כשתנאי אחר מתקיים.
Logpointהוספת הודעה למסוף בלי להשהות את הביצוע.
DOMהשהיה בקוד שמשנה או מסיר צומת DOM ספציפי או את הצמתים המשניים שלו.
XHRהשהיה כאשר כתובת URL של XHR מכילה תבנית מחרוזת.
מעקב אחר אירועיםהשהיה של הקוד שפועל אחרי הפעלת אירוע, כמו click.
חריגמשהים את שורת הקוד שמפעילה חריגה שזוהתה או חריגה שלא זוהתה.
פעולההשהיה בכל פעם שמופיעה קריאה לפונקציה ספציפית.
Trusted Typeהשהיה בהפרות של סוגים מהימנים.

נקודות עצירה בשורת קוד

כדאי להשתמש בנקודת עצירה בשורת קוד כשאתם יודעים מהו אזור הקוד המדויק שצריך לבדוק. DevTools תמיד מושהה לפני ששורת הקוד הזו מבוצעת.

כדי להגדיר נקודת עצירה בשורת קוד ב-DevTools:

  1. לוחצים על החלונית מקורות.
  2. פותחים את הקובץ שמכיל את שורת הקוד שרוצים להפסיק בה.
  3. עוברים לשורת הקוד.
  4. משמאל לשורת הקוד מופיעה העמודה של מספר השורה. לוחצים עליו. סמל כחול מופיע בחלק העליון של העמודה של מספר השורה.