תרגילים 12-14
push.break עוצר את הלולאה.if ו-else מציגים הצלחה או כישלון. בניחוש שגוי מוצגת הודעה שמבקשת לנסות שוב.counter מוכרז מחוץ לפונקציה ומתעדכן בכל לחיצה, כך שהוא נשמר בין הלחיצות.if בודק שהמונה קטן משלוש. אם לא, מופיעה הודעה שהמשחק נגמר.true או false, כדי שהלולאה הראשית תהיה קצרה וברורה.for עד array.length, ובודקים כל איבר מול המספר שהוגרל.>= בסדר הנכון.פרקי ההרצאה: תרגילים 12-14
תמלול ההרצאה: תרגילים 12-14
הטקסט המלא של הדקות הראשונות בהרצאה «תרגילים 12-14» בקורס הווידאו של PracticU – כתוביות בעברית עם זמן התחלה לכל פסקה. כך תוכלו לקרוא ולחפש את הנושאים לפני שמתחילים ללמוד.
אנחנו ממשיכים עם התרגילים שלנו והגענו לתרגילים הרבה יותר מסובכים עם פונקציות ונתחיל לאט לאט ונסתבך. המטרה בתרגילים הבאים זה לתרגל את הנושא של הפונקציות.
אז אנחנו צריכים עכשיו לעשות טקסט בוקס, תיבת טקסט שבו יוזר כותב מה הוא רוצה, איזשהו מספר שהוא חושב שהמחשב חשב עליו והמחשב חושב מגריל ארבעה מספרים אקראיים.
עוד פעם, המחשב מייצר מערך של 4 מספרים אקראיים מ-1 עד 10 כל מספר או מ-0 עד 9 מ-0 עד 9 הוא ייצר לנו מערך של 10 מספרים ואנחנו צריכים לנחש מה המחשב מה המחשב עשה אוקיי לנחש אז בואו תראו בואו תראו אנחנו מתחילים עם זה שנעשה שני כפתורים כפתור אחד מגריל
מספרים למחשב כאילו לזיכרון של המחשב וכפתור שני שבודק האם יוזר צדק או לא אז אנחנו עושים שני כפתורים כפתור של New Numbers וכפתור של צ'ק ותיבת טקסט שהיוזר יוכל לרשום את המספר שהוא חושב המטרה שהיוזר ינסה המשתמש ינסה לנחש את אחד מארבעת המספרים של המחשב כאשר כל מספר יכול להיות מאחד עד עשר אנחנו מכניסים תיבת טקסט נשים שם איזה ערך
ברירת מחדל והכי חשוב זה לשים לנו ID מזהה ייחודי של תיבת טקסט הזאת במסך, כדי שנוכל למצוא אותו ב-JavaScript לפי המזהה הייחודי הזה, ID. ניתן לזה איזשהו שם task12, טקסט בוקס, תיבת טקסט וזהו.
אז יש לנו פה כפתור שנקרא מספרים חדשים, יש לנו תיבת טקסט שהמשתמש יכול להכניס בה את הנחוש שלו, ויש לנו כפתור צ'קי תבדוק את זה, לבדוק את הניחות של המשתמש.
בואו נרשום עכשיו את הפונקציות 12a ו-12b. אנחנו צריכים לשתי הפונקציות מערך משותף של מספרים אלו שהמחשב יגריל אותם, אז אנחנו צריכים להכריז על המערך הזה מחוץ לפונקציה, לא הראשונה ולא השנייה, מחוץ לשתי הפונקציות כדי ששניהם יוכלו לראות את המערך הזה, אחרת אם היינו עושים אותו בתוך אחת הפונקציות השנייה לא הייתה יכולה לראות,
כי כל פונקציה יכולה לראות רק את מה שיש בתוכה, מעליה אבל היא לא יכולה להציץ למשתנים הפנימיים של השכנים זה נקרא סקופ מה רואה הפונקציה ומה בכל רגע אפשר לראות טוב בואו נעשה לולאה שרצה ארבע פעמים ומגרילה לנו מספר אקראי נתחיל מזה שאנחנו מעגלים
את המספר האקראי לוקחים מספר אקראי מכפילים אותו בעשר ומעגלים כלפי מטה זאת אומרת שפונקציה שמעגלת מקבלת בסוגריים שלה את המספר האקראי כפול 10.
מאת'לור מעגל כלפי מטה. מילים אחרות, מאת'לור מקצצת את הנקודה. אחרי שהגרלנו את המספר, אנחנו עושים לו פוש, דוחפים אותו לתוך המערך.
לקחנו מספר אקראי והכנסנו אותו למערך. יש לנו מערך ריק ועשינו לו פוש, אז לקחנו מערך ריק, רצנו ארבע פעמים, וכל פעם הגרלנו מספר, הכפלנו אותו ב-10, עיגלנו אותו, יצאנו למספר מעוגל מ-0 עד 9, ועשינו לו פוש לתוך המערך.
בואו נדפיס את המערך הזה בלוג בחלונית הקטנה, שזה רק בשבילנו, המשתמש לא רואה אותה, כי המשתמש רואה רק מה שקורה למסך, הוא לא לוחץ F12 לראות מה קורה שם מאחורי הקלעים, ונראה שהכל עובד כמו שצריך. אני צריך את ה-Backdoor הזה, את הדלת הסודית הזאת שמדפיסה ב-F12 את הסוד
שהמחשב הגריל כדי שאני אוכל לבדוק את התוכנה. אולי בסוף, אחרי שאני אסיים לבדוק את זה, אז אני אוריד את השורה הזאת.
מבחינתו של המשתמש הוא לא רואה שום דבר, הוא מגריל מספרים והוא לא רואה מה קורה, איזה מספרים המחשב הגריל, אבל אם אני אלך לקונסול, אם אני אלך לקונסול ואני אנקה את המסך, אני אוכל לראות מה שהמחשב הגריל, וואו, איזה מספר ארוך.
רגע, רגע, ביקשתי ממנו ארבע פעמים, למה זה כזה ארוך? לא, ביקשתי ממנו רק ארבע פעמים לעשות פוש, והוא עשה לי 20 פעם, למה יש לי 20 מספרים פה?
בואו ננסה עוד פעם, ארבע, הכל בסדר, לא? כן, ארבע מספרים. בואו ננסה עכשיו עוד פעם, נהיה לנו שמונה מספרים, נהיה לנו 12 מספרים, אתם רואים?
נהיה לנו 16, זאת אומרת, הוא כל פעם מגדיל את זה בארבע, וזה קרה בגלל ששכחנו לאפס את המערך. כל פעם שנכנסנו לפונקציה בלחיצת כפתור, כל לחיצת כפתור אנחנו נכנסים לפונקציה.
אנחנו שכחנו למחוק את מה שהיה לפני כן במערך, והיינו עושים לו כל הזמן פוש, פוש, פוש, מוסיפים לו כל פעם ארבע איברים. עכשיו, שימו לב, השורה הזאת מתבצעת רק בזמן ההפעלה הראשונית, זהו.
אחרי ההפעלה הראשונית היא כבר לא מתבצעת יותר. והמטרה שלה זה להכריז על המשתנה שיהיה בסקופ הכללי ולא בפונקציה ספציפית, כדי ששתי הפונקציות יראו אותו, הוא צריך להיות בשלב מעל זה.
אם לא הייתי מכריז אותו שמה, אז הפונקציה השנייה לא הייתה רואה אותו. קודם כל, הוספתי סוגריים מרובעים ריקים, זה אומר שבכל כניסה אני מאפס את המערך, ואני רואה שהפונקציה השנייה גם רואה אותו.
עכשיו, זה מאוד חשוב להבין שהפונקציה השנייה רואה אותו, בזכות מה? בזכות זה שההכרזה נמצאת למעלה. אם אני הייתי מכריז על המשתנה הזה בתוך הפונקציה הראשונה, תראו מה היה קורה, זה נראה שהכל בסדר, אבל כשאני עושה צ'קיט,
הם יכולים לראות שהפונקציה השנייה לא רואה אותו, היא לא רואה אותו, היא פשוט לא רואה אותו. מבחינתה זה לא מוגדר, המשתנה הזה לא מוגדר, הנה היא עושה שגיאה, אומרת undefined.
כשהמערך הזה is not defined, task12.arrnums is not defined, המערך לא מוגדר, אז בגלל שהמערך הזה לא מוגדר, למה הוא לא מוגדר בעצם?
בגלל שצריך להגדיר אותו ב-level מעל. ברגע שאני מגדיר אותו כאן, שתי הפונקציות רואות אותו. ברגע שאני מגדיר אותו בתוך אחת הפונקציות, רק פונקציה אחת רואה אותו.
זה מאוד חשוב שתבינו שכל פונקציה רואה את מה שיש בתוכה ואת מה שיש מעליה, אבל לא מה שיש אצל השכנים שלה. בגלל שיש לי שתי פונקציות כי יש לי שני כפתורים, אני צריך להגדיר משהו ב-level מעל.
יפה, בואו נבדוק שזה עובד. שזה עובד לנו והנה הפונקציה השנייה כן רואה את המערך מצוין זה הפונקציה שבודקת על הכפתור של ה-check it אני צריך ששניהם יראו אחד מייצרת מספרים חדשים והשנייה בעצם עושה את הבדיקה טוב בואו נתחיל לבדוק מה היוזר הכניס לנו אנחנו ניקח נניח על ידי jquery או javascript
זה לא משנה את הערך שיש בתוך הטקסט בוקס הולכים ומעתיקים את מה שיש לנו בטקסטבוקס בגלל שאנחנו ב-check query לא לשכוח לשים סולמית לפני המזהה כדי שהוא ידע שזה מזהה ולא קלאס ולא אלמנט ולוקחים נקודה val, נקודה val זה value זה ערך של טקסטבוקס או של כל input type לעומת inner html בdb ו html בdb וברכיבים אחרים
val זה בטקסטבוקס וברכיבי input אנחנו יכולים גם לעשות את אותו הדבר בעזרת JavaScript טהור לידי get-element-by-id ואז לרשום נקודה value document-get-element-by-id יפה מאוד עכשיו שתי השיטות עובדות הן אחת לא מפריעות לשנייה שניהן יכולות לעבוד ביחד בואו אני אראה לכם
רק שזה לא יפה לרשום בו זמנית גם בזה וגם בזה מחליטים במה משתמשים ומשתמשים במשהו אחד יפה לרצים על הכפתור ועכשיו תראו שניהן עובדות לנו יש לנו שגיאה מה שגיאה יש לנו פה שגיאה בגלל ששמתי סולמית, שמתי בטעות סולמית, ב-JQuery שמים סולמית וב-JavaScript צריך לשים רק את המזהה.
ועכשיו אנחנו נראה שגם זה עובד, גם JavaScript רגיל עובד וגם JQuery עובד, שניהם עובדים ולא מפריעים אחד לשני והכל בסדר. זה שלוש וההוא שלוש והכל בסדר.
צריך לבחור את אחד השיטות ולהשתמש בהם. לרוב אתם מגיעים לפרויקט מוכן או מנהל הפרויקט אומר לכם שאנחנו משתמשים ב-JQuery. היתרון של ג'קוורי שהכל נראה אחיד בכל הדפדפנים וגם יותר קל לעבוד איתו הרבה חברות משתמשות בג'קוורי לא משנה באיזה שיטה השתמשתי אני צריך להפוך את המספר מטקסט למספר לעשות פרס אינט
אני עושה את זה כל פעם שאני מקבל מספר דרך טקסט בוקס מהמשתמש יפה מאוד בואו נמשיך ואנחנו רצים על כל המערך זאת אומרת אנחנו עושים לולאה שרצה על כל המערך נניח יש ארבע איברים במערך, זה ירוץ על ארבע איברים במערך.
יפה מאוד. ועבור, נניח, בלולה הזאתי, אנחנו רוצים ארבע פעמים, אז אנחנו עבור כל i, i שווה 0, i שווה 1, i שווה 2, אנחנו בעצם אומרים למערך, תבדוק את הערך הראשון שלך, תבדוק את הערך השני שלך, האם הוא שווה למספר שהכניס המשתמש.
אנחנו בודקים אותם אחד-אחד. אין פקודה לבדוק את כל המערך במכה אחת. אנחנו צריכים לעבור במערך שורה-שורה ולבדוק אותה. מספר מספר ולבדוק כותבים שם של המערך סוגריים מרובעים ונניח מספר 1 מספר 2 מספר 3 אז אנחנו על ידי i עוברים על כל המספרים בלולאה ברגע שעברנו על כל המספרים בלולאה אנחנו עברו
כל אחד בדקנו האם זה מה שהיוזר הכניס ואם כן אז הוא ניצח הוא הצליח לנחש את המספר יפה מאוד אז הוא ניצח והצליח לנחש את המספר זאת אומרת עברנו עבר עבר ובדקנו שהוא אכן הצליח לנחש את המספר בואו נראה שזה עובד.
ננסה להכניס לו מספר 5, בואו נראה מה קורה. userNum שווה 5, יפה. עושים לו parse, הוא נשאר 5, רק בלי גרשיים. אורך המערך 4, כי יש 4 איברים במערך. מתחילים לרוץ על כל האיברים במערך.
לדוגמה, האיבר הראשון הוא 6, הוא באמת 6.