פרק חמישי - מבוא לג'אווה סקריפט
תודה שהמתנתם/ן בסבלנות.
תכנות בג'אווה סקריפט, לוקח את המתכנת למחוז שונה מהתכנות המוכר.
השפה מאד גמישה, הכללים מועטים [אם כי המורכבות לא פחותה בהרבה], השימוש בפריימוורקים "כבקשתך" הופך מאות שורות קוד למספר אותיות [אל תילחצו, אתם תבינו הכל], פתאום מגלים מונחים של "תאימות דפדפנים" ו"תיקוני גירסה" שמצריכים שינויים בקוד.
מי צריך את זה בכלל? לשם מה המציאו את זה? "אני יודע לתכנת כל דבר בסי שארפ, אז למה לי ללמוד ולדעת את זה"?
תיכנות צד לקוח, כפשוטו!!! תיכנות פעולות בדפדפן בהתאם להתנהגות הלקוח.
התנהגות הלקוח פירושה לחיצה על לחצנים, מעבר עכבר, ואפילו פעולות שעון.
תיכנות צד לקוח מכיל באמתחתו המון מעלות.
חיסכון בעיבוד שרת וברשת.
מהירות תגובה.
עבודה באוף ליין.
וכעת גם תיכנות למובייל על פלטפורמה אחת...
בכדי להתחיל לכתוב סקריפט, יש צורך לכתוב את הקוד בין תגית SCRIPT פותחת לסוגרת.
היות והאשכול נועד למתכנתים, אסכם כאן כללי אצבע שיכניסו אתכם במהירות היישר אל תוך העניינים.
משתנה מוצהר במילה VAR [מכאן דוט נט 4 גנבו אותה]
פונקציה מתחילה ב FUNCTION, סוגריים עגולות לפרמטרים, ומסולסלות לבלוק.
פקודה מסתיימת בנקודה - פסיק [;]
פונקציה לא מצהירה על החזרת ערך, פשוט שמים RETURN.
אפשר להשתמש בגרש בודד או גרשיים כפולות בצורה חופשית [או בשניהם יחד לקינון מחרוזת]
גם כאן אשתמש ב JSFIDDLE להדגמות.
בכדי לגרום לדפדפן "לזרוק" הודעה, משתמשים בפקודה ALERT.
ואת זה נדגים בלינק הבא:
לינק
שימו לב שחתכתי את המשפט לשניים, והשתמשתי ב += כדי לשרשר מחרוזות...
אבל אני רוצה כבר מייד להתחיל להדגים יכולות יותר מעניינות.
למה שלא תתקבל ברכה שהשם של המשתמש יוצב בתוכה?
מאיפה המחשב ידע את שם המשתמש? מה לא ידעתם שג'אווה סקריפט יודע עליכם הכל???
סתאאאאםםםםםם.
ניתן למשתמש תיבת טקסט למלא את שמו, וכפתור ללחוץ.
את ההודעה נקפיץ בלחיצה על הכפתור.
על הדרך נלמד איך ג'אווה סקריפט ניגשת לאובייקטים בעמוד [DOM], ואיך היא מסוגלת "לקרוא" ערך של תיבת טקסט למשל.
אז מה נדרש לנו?
בחלק ה HTML:
- אובייקט תיבת טקטס
- אובייקט כפתור
בחלק הסקריפט:
פונקציה שתשרשר את הטקסט מתיבת הטקסט להודעה מוכנה, ותקפיץ את הטקסט השלם באמצעות ALERT.
אוקיי, אבל מי יחבר בין הכפתור לפונקציה?
אנחנו נשתמש במאפיין onclick שיש לאובייקט הכפתור, ושם נשתול קריאה לפונקציה.
אז הנה הדוגמה
לינק
שימו לב ששמתי את הקוד בתוך מקטע ה HTML ולא במקטע ה JS, זאת ערב בעיה קטנה במערכת שלהם, שלא רציתי להכנס אליה.
אז אולי ניתן משימה קטנה, תבצעו אותה, תשמרו את השינויים [בכפתור update] ותעלו לכאן את הלינק שקיבלתם
המשימה היא פשוטה:
במידה ולא הוזן כלום לתיבת הטקסט, תופיע הודעה מתאימה.
רמז: מבנה התנאי של ג'אווה סקריפט הוא כמו בשפת C
PHP:
if(a == b){
alert('equal');
}
else{
alert('not equal');
}
בהצלחה.
בפרקים הבאים ניצור דברים מעט יותר מורכבים ונבין מהם הפריימוורקים של ג'אווה סקריפט