עבודה עם JavaScript Console

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

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

היום כמעט כל כלי הפיתוח של הדפדפנים השונים מאפשרים עבודה עם JavaScript Console. הקונסולה מאפשרת לנו לכתוב מסרים שונים בסקריפט שלנו ולקטלג אותם. נשמע מסובך? הכי טוב להשתמש בדוגמא קטנה. שימו לב לסקריפט הבא:


<script type="text/javascript">
console.log('hello, I am messege');
console.info('hello, I am info');
console.warn('hello, I am warning');
console.error('hello, I am error');
</script>

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

סוגי הערות על קונסולת פיירבאג
סוגי הערות על קונסולת פיירבאג

כמובן שזה לא מוגבל גם לפיירבאג, אפשר להשתמש בקונסולה של כרום:

הערות בקונסולה של כלי הפיתוח של כרום

וגם בקונסולה של כלי המפתחים של אינטרנט אקספלורר 9:

הערות בקונסולה בכלי המפתחים של אינטרנט אקספלורר 9
הערות בקונסולה בכלי המפתחים של אינטרנט אקספלורר 9

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


<script type="text/javascript">
myObj = {   property1 : "foo",
			property2 : "bar"
		}
console.log(myObj);
</script>

ובקונסולה אוכל לראות את האובייקט ואף להקליק עליו כדי לראות אותו יותר בנוחות. הנה הדוגמא:

אובייקט בלוג
אובייקט בלוג

יש עוד דברים מרתקים שאפשר לעשות עם JavaScript Console אבל זה הבסיס. שווה הרבה יותר מאשר לעשות alert, לא?

פוסטים נוספים שכדאי לקרוא

פתרונות ומאמרים על פיתוח אינטרנט

עבודה עם GPT למתכנתים

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

DALL·E 2023-10-21 22.28.58 - Photo of a computer server room with red warning lights flashing, indicating a potential cyber threat. Multiple screens display graphs showing a sudde
יסודות בתכנות

מבוא לאבטחת מידע: IDOR

הסבר על התקפה אהובה ומוצלחת שבאמצעותה שואבים מידע מאתרים

פתרונות ומאמרים על פיתוח אינטרנט

יישום של nonce על מנת להגן מפני התקפות injection

בפוסט הקודם הסברתי על hash עם CSP על משאבי inline – שזה נחמד ומעולה אבל פחות ישים בעולם האמיתי שבו בדרך כלל התוכן ה-inline (בין

גלילה לראש העמוד