מבוא ל-JavaScript

למרות השם, JavaScript קשור ל-Java רק בכך שיש דמיון תחבירי בין שניהם. התחביר של JavaScript במהלך הפיתוח הראשוני שלו הושפע באופן רופף מהתחביר של Java והוא נקרא LiveScript כששלח לראשונה גרסת בטא של Netscape Navigator בשנת 1995, גם כדי ליישר קו עם חלק מההצעות האחרות של Netscape בעל שם, וגם כדי לציין את העובדה שהוא פועל 'בשידור חי' בדפדפן. Microsoft פרסמה יישום משלה של JavaScript, שנקרא "JScript", זמן קצר לאחר מכן, באמצעות Internet Explorer 3.0.

את העבודה המוקדמת הזו הוגשו על ידי Netscape ל-Ecma International, ארגון שמפתח ומפרסם תקנים טכניים, כדי ליצור ולפרט את האופן שבו שפת הסקריפטים הזו צריכה להיות מובנת לדפדפנים אחרים. בשנת 1997, הוציאה Ecma International את תקן ECMA-262 לסטנדרטיזציה של הגרסה הראשונה של שפת כתיבת סקריפטים בשם ECMAScript. ECMAScript הוא התקן שמודיע על יצירת שפות סקריפט ספציפיות יותר, לדוגמה, העבודה של Microsoft מאוחר יותר על ה-JScript, ה-ActionScript של Adobe וה-JavaScript עצמו, שכבר לא קיים.

הבחנה זו חשובה כשמדברים על היבטים ותכונות ספציפיות של JavaScript. "ES5" מתייחסת לגרסה ה "גרסה" הגדולה הראשונה של תקן ECMAScript בשנת 2009, לאחר שנים של פיתוח חלקי יותר. "ES6" (או "ES2015") הוא קיצור לתקנים שנקבעו על ידי המהדורה השישית של ECMAScript, שהושקה בשנת 2015. לאחר ES6, יצאו מהדורות חדשות של תקן ECMAScript מדי שנה, והשינויים והתוספות של כל מהדורה מכונים לפי שנה ב-"ES2016" או "ES2017".

הכללים הבסיסיים

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

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

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

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

ברמה גבוהה, אפליקציות JavaScript מורכבות מהצהרות ומביטויים.

הצהרות

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

let myVariable = 4;

myVariable;
> 4

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

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

חסימת הדוחות

הצהרת חסימה מקבצת כמה הצהרות והצהרות בתוך זוג סוגריים מסולסלים ({}). היא מאפשרת לשלב הצהרות במקומות שבהם JavaScript מצפה לאחד בלבד.

ברוב המקרים, הצהרות חסימה יופיעו לצד הצהרות תהליך בקרה, כמו if:

if ( x === 2 ) {
  //some behavior;
}

ביטויים

ביטוי הוא יחידת קוד שמפיקה ערך, ולכן אפשר להשתמש בה בכל מקום שבו צפוי ערך. 2 + 2 הוא ביטוי שמוביל לערך 4:

2 + 2;
> 4

'אופרטור הקיבוץ', צמד של סוגריים סוגרים, תואם, משמש לקיבוץ חלקים של ביטוי כדי להבטיח שחלק מהביטוי יוערך כיחידה אחת. לדוגמה, אפשר להשתמש באופרטור קיבוץ כדי override the mathematical order of operations או כדי לשפר את נוחות הקריאה של הקוד:

2 + 2 * 4;
> 10

( 2 + 2 ) * 4;
> 16

let myVariable = ( 2 + 2 );

myVariable;
> 4

הקלדה חלשה

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

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

>>> "1" + 1
Traceback (most recent call last):
  File "<stdin>", line 1, in <module>
TypeError: cannot concatenate 'str' and 'int' objects

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

"1" + 1;
> "11"

ניתן גם לשנות באופן מפורש את סוגי הנתונים. הדוגמה הבאה מאלצת את הערך המספרי 100 לערך מחרוזת של "100" באמצעות השיטה toString המובנית ב-JavaScript:

let myVariable = 100;

typeof myVariable;
> "number"

myVariable = myVariable.toString();
> "100"

typeof myVariable;
> "string"

תלות באותיות רישיות (Case sensitivity)

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

console.log( "Log this." );
> Log this.

console.Log( "Log this too." );
> Uncaught TypeError: console.Log is not a function

const myVariable = 2;

myvariable;
> Uncaught ReferenceError: variablename is not defined

myVariable;
> 2

רווח לבן

JavaScript לא רגיש לרווחים. המשמעות היא שהתרגום מתעלם מהטקסט ומהסוג (הטאבים או הרווחים) של הרווח הלבן שבו נעשה שימוש.

                     console.log(       "Log this"  );console.log("Log this too");
> "Log this."
> "Log this too."

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

let x;

[אסימונים: [let] [x] ]

letx;
> Uncaught ReferenceError: letx is not defined

[אסימונים: [letx] ]

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

let           x                             =                           2;

[אסימונים: [let] [x] [=] [2] ]

הדבר נכון גם לגבי מעברי שורה, אם כי יש מקרים שבהם מעברי שורה עלולים לגרום לבעיות על ידי סיום מוקדם של הצהרה):

let x
=
2;

[אסימונים: [let] [x] [=] [2] ]

מבחינה סגנונית, סוגים מסוימים של הצהרות בדרך כלל כוללים שורה אחת:

let x = 1;
let y = 2;

בהצהרות מסוימות נעשה בדרך כלל שימוש בכמה שורות:

if ( x == 2 ) {
  //some behavior;
}

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

let x=1;let y=2;

if(x==2){}

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

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

let myVariable = 10;

if ( typeof myVariable === "number" ) {
    console.log( "This variable is a number." );
    if( myVariable > 5 ) {
     console.log( "This variable is greater than five." );
    }
}

> "This variable is a number."
> "This variable is greater than five."

בחינת ההבנה