הנך נמצא: מדריך מתקדם / שיעור 1 / דף 4
 


המדריך של תאו ל- JavaScript
 


דפים בשיעור זה:
1: המדריך המתקדם
2: תוכנית השיעור
3: קיצור if-then-else
4: מהו הדבר ששמו var?
5: דרכו של ה- var
6: מסקנות
|
|
|
|
|
|
|

שיעור 1

דף 4: מהו הדבר ששמו var?

הרבה קודם בפרק 1, יום 2 <link>, אמרתי שמפעם הראשונה בה אתה מצהיא על משתנה עליך להצהיר עליו עם המילה "var". הבטחתי שאני אסביר על כך כשנגיע לפונקציות. ובכן, שכחתי! אז, עכשיו הוא הזמן.

רק עך מנת לרענן את זכרונך, הנה דוגמא ל- var בשימוש:

var hapiness = "a banana split";
alert("The monkeys happiness is " + happiness);

ה- var המפורסם מצהיר על משתנה הקרוי happiness, ואז שולח תיבת alert שמשתמשת במשתנה זה.

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

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

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

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

"50 degrees Fahrenheit is 10 degrees Celsius."

תוכל לרשום את אותו הקוד בלי ה- var שיראה כך:

function fahrenToCelsius(faren)
{
  temp = (faren - 32) * 5/9;
  return temp;
}

function convertTemp()
{
  temp = prompt("what temperature fahrenheit? ","50");
  celsius = fahrenToCelsius(temp);
  alert(temp + " degrees Fahrenheit is " + celsius + " degrees Celsius.");
}

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

טוב, מוכן?

הדבר המבלבל בדוגמא זו הוא שנעשה שימוש במשתנה הקרוי temp בשתי הפונקציות. בפונקצית ה- ()convertTemp, הוא משמש לשמירת הטמפרטורה בפרנהייט (שמתקבלת ע"י המשתמש). בפונקציה ()farenToCelsius, הוא משמש לחישוב הטמפרטורה בצלסיוס. לא רק שזה מבלבל אותנו, זה גם מבלבל את JavaScript. הנה מה שיקרה אם תריץ את הקוד בלי ה- vars.

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

"10 degrees Fahrenheit is 10 degrees Celsius."

מדוע התוכנית חושבת לפתע שהקשת 10 מעלות ולא 50? הבא נעקוב אחר מהלך התוכנית על מנת להבין מה קרה.

כשקראנו לפונקציה ()convertTemp והקלדנו "50" לתוך תיבת הטקסט, הרי ש: temp=50. במהלך הבא temp מועבר לפונקציה ()farenToCelsius. בתוכה, המשתנה faren מקבל את הערך 50 והמשתנה temp מקבל את הערך של הביטוי (50-32)*5/9, שהוא 10. לפני החזרת הערך אנו יודעים ש: faren=50 וכן temp=10. עכשיו ()farenToCelsius מחזירה 10 למשתנה celsius: temp=10 וכן: celsius=10. ואנו נותרים עם ההודאה השגויה.

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

לרע מזלנו, אין זה הפתרון האידיאלי. ככל שתוסיף יותר ויותר פונקציות לקוד שלך, כך תהפוך הבעייה לסבוכה יותר, ויקשה עליך לבחור שמות משתנים שונים בכל מקום ומקום. כמו כן, תאלץ להשתמש בהמון שמות משתנים כמו: loop, index, count ועוד. כולם בעלי משמעות דומה – מה שהופך להיות ממש מציק.

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

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

חזור לתחילת הדף

לדף הבא «--

 
       
       
   
 
 

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