הנך נמצא: מדריך בסיסי / שיעור 2 / דף 1
  


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


דפים בשיעור זה:
1: מדריך ה-Javascript
2: דוגמת המשתנים
3: הקסם שבמחרוזות
4: תרגול משתנים
5: סיעוף אם-אז
6: דוגמא פשוטה לסיעוף
7: תרגול אם-אז
8: מאורעות קישור
9: החלפת תמונות
10: תרגיל 2
11: סיכום
 |
|
|
|
|
|
|
|
|
|
|
|

שיעור 2

דף 1: המדריך של תאו ל- Javascript – שיעור 2.

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

מוכן? הגיע הזמן ללמוד את העקרונות של תכנות באמצעות מחשב. תחנה ראשונה, משתנים. אם היית בשיעורי אלגברה, וודאי ראית משתנים. אם לא, אל תדאג. באמצעות המשתנים Javascript שומר מידע. למשל, אם תכתוב: "x=2", "x" הוא משתנה ששומר את הערך "2". אם אז תרשום "y=x+2", "y" יקבל (וישמור) את הערך 5.

הנה דוגמא לקוד Javascript שעושה שימוש במשתנים.

הבט בקוד המקור של הדוגמא, ונעבור עליו צעד אחר צעד. הנה מה שתראה:

<script language="JavaScript">
<!-- hide me

את שתי השורות הראשונות כבר ראית קודם. הן ההקדמה הרגילה לכל תוכנית Javascript.

// load up some variables

var secs_per_min = 60;
var mins_per_hour = 60;
var hours_per_day = 24;
var days_per_year = 365;

אח"כ באה הערה שמסבירה כי בבלוק הקרוב יקבעו מספר משתנים וערכיהם (הצהרה).

בבלוק אח"כ מובאות זו אחר זו הצהרות על משתנים וערכיהם. עלינו לשים לב למספר נושאים:

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

משתנה חייב להתחיל באות או קו תחתי. לאחר האות הראשונה יכולים לבוא גם מספרים. כך ש- moti_25 הוא שם משתנה חוקי.

בדר"כ שמות המשתנים הם רגישי אותיות (case sensitive), כלומר: רגיש להבדלים בין אותיות גדולות וקטנות, אבל לא תמיד. כלומר Moti ו- moti הם שמות משתנים שונים לחלוטין עבור מרבית מהדפדפנים (ועבור מיעוטם - זהים). בדר"כ כדאי להחליט על קונבנצית שמות הגיונית ולהצמד אליה. אני באופן אישי, מעדיף לעשות שימוש רק באותיות קטנות עם קו תחתי שמפריד בין מילים. אחרים מעדיפים להגדיל כל אות ראשונה של מילה חדשה באותו שם משתנה. כלומר: SecsPerMin או sec_per_min.

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

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

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

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

// do some calculations

var secs_per_day = secs_per_min * mins_per_hour * hours_per_day;
var secs_per_year = secs_per_day * days_per_year;

מיד לאחר בלוק ההצהרות יש הערה נוספת ושני חישובים. לאחר ביצוע שתי האמירות הנוספות המשתנה secs_per_year יכיל את הערך המספרי המתקבל ע"י הכפלת 60, 60, 24 ו- 365. מעתה ואילך בכל מקום בו יופיע שם המשתנה secs_per_year המפרש של Javascript יחליפו בערך מספרי זה.

// end hiding -->
</script>

ולבסוף סגירת ה- Javascript כפי שכבר הכרנו משיעורים קודמים.

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

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

לדף הבא «--

  
       
       
   
 
 

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