בדיקת תקינות Javascript/EmcaScript

אם אתם מפתחי web, אז כמעט בטוח שיצא לכם לכתוב קוד Javascript (או EmcaScript) בשביל לפחות לעשות משהו אחד בצד הלקוח, אפילו אם זה לבדוק האם יש ערך כלשהו או אולי סתם להציג הודעה.

כאשר אנחנו עובדים עם CSS ו HTML, אנחנו (אני מקווה) דואגים לבדוק את התקינות של כל אחד ואחד מהם, מעבר לזה שהם "עובדים", כלומר בודקים שהם באמת נכתבו לפי התקן, בד"כ מה שקורה עם Javascript הוא שאנחנו בודקים האם הקוד עובד בכל הדפדפנים שאנחנו רוצים, ומרוצים עד הגג כשזה באמת קורה.

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

function something () {

לבין לכתוב את זה ככה:

function something()
{

דבר ראשון בטח לא שמתם לב, אבל יש 2 הבדלים בקוד שלי. ההבדל הראשון הוא הרווח בין השם לבין הסוגריים. ב Javascript הרווח צריך להיות רק מול אופרטור או מילה שמורה, אחרת הוא חייב להיות צמוד.

ההבדל השני הוא הסוגריים המסולסלים. מסתבר שסוגריים מסולסלים בגובה הפונקציה (או כל בלוק/סוגר אחר), מתורגם אחרת מאשר סוגר מסולסל מתחת. הצורה הנכונה היא כמובן סוגר בגובה הפונקציה.

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

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

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

הכלי נכתב על ידי Douglas Crockford, הוא אותו אדם שיצר את JSON (סתם בשביל שתדעו), והוא גם עד כמה שאני יודע, יושב בוועדה של EmcaScript ועובד בYahoo! בתור מתכנן ג'אווה סקריפט.

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

שם הכלי הוא JSLint, והוא ישנה את הצורה שאתם כותבים Javascript אם תקשיבו לו.

3 מחשבות על “בדיקת תקינות Javascript/EmcaScript

  1. אורן

    מעולה, תודה.
    אגב דגלאס קרוקפורד, יש לו אחלה הרצאות על ג'אוהסקריפט תחת השם:
    "The javascript programming language"

    יש בגוגל וידאו.

  2. el.il

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

    תודה על הלינק!

    נ.ב:
    התקן של EmcaScript זה אותו תקן של javascript 1.8 (ומעלה?) שמיושם בפיירפוקס? יש הבדלים?

להשאיר תגובה

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

הלוגו של WordPress.com

אתה מגיב באמצעות חשבון WordPress.com שלך. לצאת מהמערכת / לשנות )

תמונת Twitter

אתה מגיב באמצעות חשבון Twitter שלך. לצאת מהמערכת / לשנות )

תמונת Facebook

אתה מגיב באמצעות חשבון Facebook שלך. לצאת מהמערכת / לשנות )

תמונת גוגל פלוס

אתה מגיב באמצעות חשבון Google+ שלך. לצאת מהמערכת / לשנות )

מתחבר ל-%s