דילוג לתוכן הראשי

משתנים ב-javascript

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



היי, כאן אסף מקודאקטיב!
היום במסגרת HTML ב-5 דקות אנחנו נלמד על משתנים ב-javascript.
משתנים הם אבני הבניין של כל שפת תוכנה. הם משמשים אותנו כדי לשמור מידע בזיכרון של המחשב.
משתנה הוא כמו קוספא שבתוכה מאחסנים מידע שניתן לשימוש בהמשך.
לכל קופסא כזאת יש שם ולאחר שמאחסנים בה את המידע, יהיה אפשר לגשת אליה בהמשך באמצעות השם של הקופסא.
לדוגמא: למשתנה קוראים X והמידע שבתוכו הוא המספר 4.


או משתנה בשם playerName והמידע שבתוכו הוא המילה "אסף".
ב-javascript מגדירים משתנה באמצעות המילה השמורה var (תיקון - נכון להיום רצוי יותר להשתמש ב-let מסיבות שונות הקשורות להתפתחות השפה, לכן אשתמש בהמשך במילה זו) ולאחריה שם המשתנה.
let x;
הסימן נקודה-פסיק משמש לסיום משפט.
javascript היא שפת case sensitive ולכן חשוב להקפיד על גודל האותיות. את המילים השמורות כמו let כותבים באותיות קטנות. שמות של משתנים נהוג לכתוב גם באותיות קטנות. שם של משתנה יכול להכיל אותיות ומספרים, אבל לא רווחים. לכן, אם נרצה לתת שם שמורכב מ-2 מילים למשל, נכתוב אותו בשיטת camel case. למשל: var playerName מתחיל באותיות קטנות אבל האות הראשונה בכל מילה, החל מהמילה השניה ואילך היא אות גדולה. ככה יותר קל להבחין כשמסתכלים ולראות שיש כאן 2 מילים.
כדי להכניס ערך כלשהו למשתנה, משתמשים בסימן "=". למשל: 
x=4;
בשלב הראשון רק הגדרנו את המשתנה x אסל כאן אנחנו מאתחלים אותו ומכניסים לו את הערך 4.
צריך לשים לב שמאחר והשפה היא case sensitive ה-x שהגדרנו כאן שונה מ-X (גדולה). אם נכתוב עכשיו 
X=5;
הדפדפן לא ידע מה אני רוצה כי הגדרתי לו x (קטנה) ולכן ה-X הגדולה לא קיימת מבחינתו.
playerName = "Assaf";
זו דוגמא להכנסת ערך מסוג מחרוזת - String (רצף של תווי טקסט בתוך גרשיים) - לתוך המשתנה playerName.



אפשר גם להכריז על משתנה ולהכניס לתוכו ערך בשורה אחת בצורה כזאת:
var playerName = "Assaf";
עכשיו לאחר שהגדרנו את המשתנה playerName איך אנחנו רואים (בעזרת קוד) מה שמור בתוכו?
אנחנו יכולים להשתמש ב-alert (שפותח לנו חלון התראות) ובתוך הסוגריים אנחנו שמים את שם המשתנה שהגדרנו:
alert(playerName);
 אם נריץ את הקוד הזה נראה שנפתח חלון התראה עם המילה Assaf בתוכו. זהו הערך השמור במשתנה.
עכשיו בואו נראה מה יקרה אם נשנה את הערך שיש בתוך המשתנה playerName ונשים בתוכו ערך אחר:
playerName = "Dudu";
נשים שוב alert כדי לראות איך זה מגיב:
alert(playerName);

נרפרש את העמוד ונראה שקודם כל אנחנו מקבלים מסך עם תיבת ההודעות שבתוכה המילה Assaf (מה-alert הראשון) ולאחר לחיצה על כפתור OK נפתחת לנו עוד תיבה והפעם בתוכה המילה Dudu. מה שקרה פה זה שבעצם המשתנה מכיל את הערך החדש. כלומר הערך השתנה. מכאן השם "משתנה" (variable). הוא מכיל ערך שעשוי להשתנות במהלך חיי התוכנה.



אז מה למדנו?

- משתנים משמשים לשמירה ולגישה אל פרטי מידע
- על משתנה מכריזים מאמצעות המילה השמורה let
- למשתנה מכניסים ערך ע"י הסימן "="
- משתנים יכולים להכיל פרטי מידע מסוגים שונים (מספרים, טקסט ואחרים)

תגובות

פוסטים פופולריים מהבלוג הזה

כלים לפיתוח משחקים בלי ידע בתכנות

מאחר ויש לי די הרבה נסיון בהדרכת תכנות למתחילים (ובפרט בתחום פיתוח משחקים) אני מתעניין כל הזמן בכלים טובים עם ערך מוסף גם לפיתוח משחקים מהיר וגם ללמידה של תכנות על הדרך. לאחרונה החלטתי לפתוח קורס\חוג מקומי לנוער שילמד פיתוח משחקים לחסרי נסיון, או בעלי נסיון בסיסי בתכנות וזה הוביל אותי לבדוק באופן יותר מעמיק אילו כלים קיימים כרגע שעשויים לתמוך בקורס כזה. אחד הקריטריונים החשובים לדעתי בבחינת כלים כאלה היא עד כמה אפשרי ונוח ליצור באמצעותם משחקי HTML5 שאפשר בקלות לפרסם באתר עצמאי, או באתרי מפיצים, כי לשם אני מאמין שהתעשיה הולכת. לכן, קודם כל הלכתי וחיפשתי רשימת השוואה למנועי משחק שמאפשרים ליצור משחקי HTML5 והגעתי לרשימה הזאת. אפשר לראות כאן גם frameworks כמו Phaser, שמאפשרות בניית משחק ע"י תכנות בלבד וגם כלים כמו Construct 2 שלא מצריכות ידע בתכנות בכלל ונותנות ממשק גרפי עם אפשרויות בחירה והזנת פרמטרים מסוגים שונים על מנת להגיע לאותן תוצאות. מנסיוני יש 2 אסכולות של מפתחים: 1. כאלה שבאו מרקע של תכנות פרופר (מדעי המחשב) - מעדיפים לתכנת הכל באמצעות עורכי קוד למיניהם...

קונסטרקט 3 - הכלי הכי אפקטיבי שאני מכיר לפיתוח משחקים קטנים-בינוניים

את הפוסט הקודם (על Stencyl) כתבתי לפני כמעט שנה ומאז עברתי לעבוד עם Construct 3 שפתר לי 2 בעיות משמעותיות: רספונסיביות וזמן להגיע לתוצאה. בנוסף, יש לקונסטרקט המון מדריכים באינטרנט, קהילת משתמשים גדולה ופעילה ועדכונים שוטפים בתדירות מרשימה. מהר מאד התחלתי לפתח משחקים בקונסטרקט וזה פשוט כיף גדול להבין שבמקום להשקיע כמה שבועות בכתיבת קוד אפשר להגיע לאותה תוצאה בכמה ימים בלי לכתוב שום קוד ורק להתרכז ביצירה עצמה. האמת היא שכל כך התלהבתי מהפשטות שבתוכנה, שהחלטתי לפתוח קורס לפיתוח משחקים בקונסטרקט והיום אני מעביר הדרכות פיזית ב-2 כיתות לתלמידים שהצטרפו לקורס שמתקיים בגדרה. במקביל אני ממשיך לפתח משחקים בקונסטרקט בשעות הפנאי ונהנה מכל רגע. בשלב הבא אני מתכנן לפתוח קורס אינטרנטי בקונסטרקט, כך שכל אחד שרוצה יוכל לפתח משחקים, אבל בינתיים עד שזה יקרה, אני רוצה לפרסם הדרכות קצרות מדי פעם שיתנו לכם טעימה מתוך החוויה של פיתוח בקונסטרקט. בהדרכה  הזאת אציג בקצרה את התוכנה - איך מגיעים אליה ומתחילים לעבוד איתה. בהדרכות הבאות אציג דוגמאות קצרות של עבודה עם התוכנה כחלק מתהליך בניית משחק...

איך לבנות משחק HTML5 ב-Phaser עם Typescript - חלק 2

קבלו את החלק השני בסדרה - איך בונים משחק HTML5 ב-Phaser עם Typescript. בחלק הראשון בניתי את ה-HTML וה-CSS והורדתי את קבצי פייזר. הפעם אני בונה את ה-class הראשי של המשחק ומאתחל אותו. תהנו! לחץ כאן על מנת להוריד את קוד המקור הסופי הלינק להדרכה החינמית:  http://www.codactive.com