‫תכנית לימודים במודול‬
‫מבוא למדעי המחשב‬
‫במקצוע מדעי המחשב‪ ,‬לחטיבת הביניים‬
‫כיתה ח‬
‫מודול צד לקוח‬
‫‪1‬‬
‫תכנית לימודים חט"ב במדעי המחשב‬
‫מודול צד לקוח‬
‫נימוקים לפיתוח קוד לימודים במדעי המחשב לחטיבות הביניים‬
‫מודול זה מיועד לתלמידי חטיבות הביניים‪ ,‬אשר למדו מבוא למדעי המחשב ויודעים‬
‫לממש אלגוריתמים באמצעות פקודות בקרה כגון ‪ IF-THEN-ELSE, FOR, WHILE‬בכל שפת תכנות‬
‫שהיא ‪,‬למשל ‪.Scratch‬‬
‫מודול זה נועד להעמיק ולהרחיב את הידע האלגוריתמי של התלמידים בנושאי תנאים ולולאות‬
‫תוך שימוש בטכנולוגיה שונה מזו שהכירו עד כה‪.‬‬
‫מודול זה יתמקד בהקניית ידע בטכנולוגיות הפיתוח החדשניות בעולם האינטרנט‪,‬‬
‫פיתוח חשיבה מופשטת ודרכי פתרון בעיות מודולריות‪.‬‬
‫בסיום הלימוד התלמידים יגישו פרויקט צד לקוח שיכיל פיתוח משחק ‪ /‬אפליקציה ‪ /‬אתר המבוסס‬
‫על אחד הנושאים שנלמדו‪.‬‬
‫התכנית תלמד כולה במעבדת מחשבים‪ .‬שעתיים שבועיות לתלמיד‪ .‬הלימוד יתקיים תוך ביצוע משימות‬
‫מובנות ומשימות התנסות חופשית בסביבה‪.‬‬
‫נושאי המודול וחלוקת השעות‬
‫פרק שם הפרק‬
‫מס'‬
‫‪1‬‬
‫‪HTML‬‬
‫‪ ‬סביבת העבודה‪ :‬קבץ‪ ,‬פתיחת פרויקט‪ ,‬שמירה‪ ,‬תיעוד‬
‫‪ ‬תגיות עיצוב דף ‪,‬קישור‪ ,‬תמונה‪ ,‬טבלה‪ ,‬טופס‬
‫‪ ‬בניית אתר ‪ 5‬דפים מתחום עניין התלמיד‬
‫‪2‬‬
‫מבוא ל ‪JavaScript-‬‬
‫‪ ‬שילוב תגית ‪ script‬בקוד‬
‫‪ ‬פלט ‪,‬הודעה מוקפצת ‪,‬הוראת הדפסה‬
‫משתנים‪ ,‬קלט‪/‬פלט וחישובים‪:‬‬
‫‪3‬‬
‫‪ ‬הגדרת משתנה‬
‫‪ ‬קליטה והדפסה‬
‫‪ ‬אופרטורים מתמטיים‬
‫‪ ‬אופרטורים מנה ושארית חלוקה‬
‫משפטי תנאי ‪ -‬ביצוע מותנה‬
‫‪4‬‬
‫‪ ‬תנאים לוגיים‬
‫‪ ‬הוראת תנאי‬
‫‪ ‬תנאים מורכבים‬
‫ביצוע חוזר‬
‫‪5‬‬
‫‪ ‬ביצוע חוזר מוגדר מראש‬
‫‪ ‬ביצוע חוזר מותנה‬
‫‪6‬‬
‫‪7‬‬
‫אלגוריתמים מתקדמים‬
‫‪ ‬מונים ‪ ,‬צוברים‬
‫‪ ‬מספרים אקראיים‬
‫‪ ‬לולאות מקוננות‬
‫פונקציה בשילוב ‪onClick‬‬
‫‪ ‬מבנה פונקציה ‪ ,‬קריאה לפונקציה‬
‫‪ ‬שתילת תוצאות חישוב הפונקציה בדף ‪HTML‬‬
‫שעות‬
‫התנסות‬
‫שעות‬
‫עיוניות‬
‫סה"כ‬
‫שעות‬
‫‪4‬‬
‫‪1‬‬
‫‪5‬‬
‫‪2‬‬
‫‪1‬‬
‫‪3‬‬
‫‪7‬‬
‫‪1‬‬
‫‪8‬‬
‫‪3‬‬
‫‪1‬‬
‫‪4‬‬
‫‪4‬‬
‫‪1‬‬
‫‪5‬‬
‫‪8‬‬
‫‪2‬‬
‫‪10‬‬
‫‪8‬‬
‫‪2‬‬
‫‪10‬‬
‫‪2‬‬
‫פרק שם הפרק‬
‫מס'‬
‫גרפיקה ‪Canvas‬‬
‫‪8‬‬
‫‪ ‬הגדרת ‪Canvas‬‬
‫‪ ‬יצירת צורות מורכבות באמצעות שימוש בפונקציות מוכנות‬
‫ליצירת צורות הנדסיות פשוטות (עיגול‪ ,‬מלבן‪ ,‬קו)‬
‫‪ ‬שילוב לולאות בגרפיקה‬
‫אנימציה ‪Canvas‬‬
‫‪9‬‬
‫‪ ‬תזוזת אלמנט לפי טיימר ולוח צירים‬
‫‪ ‬אירוע לחיצת עכבר ב ‪Canvas -‬‬
‫‪ ‬תזוזת אלמנט לפי מעבר העכבר‬
‫‪ ‬תזוזת אלמנט לפי מקשי חצים‬
‫פרויקט סיכום אישי‬
‫‪10‬‬
‫סה"כ‬
‫שעות‬
‫התנסות‬
‫שעות‬
‫עיוניות‬
‫סה"כ‬
‫שעות‬
‫‪4‬‬
‫‪1‬‬
‫‪5‬‬
‫‪8‬‬
‫‪2‬‬
‫‪10‬‬
‫‪48‬‬
‫‪12‬‬
‫‪60‬‬
‫‪3‬‬
‫מבוא למדעי המחשב‬
‫פרק ‪HTML :1‬‬
‫להכיר את סביבת העבודה בה ילמד המודול ולבנות קוד בן מספר פקודות סדרתיות‪.‬‬
‫‪.‬‬
‫מטרות ביצועיות‪:‬‬
‫‪ .1‬התלמיד ידע להתקין‪/‬להפעיל את סביבת העבודה‬
‫‪ .2‬התלמיד ידע לפתוח פרויקט קיים‬
‫‪ .3‬התלמיד יסביר את מטרות התיעוד של קודים ויבצע תיעוד לפעולות ולאלגוריתם‬
‫‪ .4‬התלמיד ידע מבנה דף ‪HTML‬‬
‫‪ .5‬התלמיד יבדיל בין שם תגית‪ ,‬תו כן תגית‪ ,‬סוף תגית‬
‫‪ .6‬התלמיד יבין את המבנה ההיררכי של תגיות‬
‫‪ .7‬התלמיד יכיר תגיות עיצוב‪ ,‬תמונה‪ ,‬קישור‪ ,‬טבלה‪ ,‬טופס‬
‫‪ .8‬התלמיד ידע לשנות אתר אינטרנט קיים ומוכר ע"י "הצג מקור" להבין קוד "אמת" ולבצע שינוי‬
‫מושכל ‪.‬‬
‫‪ .9‬התלמיד ידע לשמור פרויקט ולתעד אותו‬
‫מושגים והכוונה‪:‬‬
‫‪ .1‬סביבת עבודה‪ ,‬קובץ‪ ,‬תיקיה‪ ,‬שמירה‪ ,‬פתיחה‪ ,‬תיעוד בעת שמירה‬
‫‪ .2‬קוד‪ ,‬קוד ‪ ,‬כתיבת קוד‪ ,‬כתיבת הערות בגוף הקוד‬
‫‪ .3‬הוראות סדרתיות – הוראות תנועה והוראות מראה‬
‫‪ .4‬פלט‪ ,‬פלט לצג‪ ,‬נכונות של פלט‪ ,‬פלט ידידותי‪ ,‬פלט ביניים (לבדיקת האלגוריתם)‬
‫דרכי ההוראה‪:‬‬
‫‪ .1‬הכרת סביבת העבודה תלמד במעבדה‪ ,‬תוך הסבר על התקנת סביבת העבודה‪ ,‬הפעלתה וכתיבת‬
‫קודים בסביבה‬
‫‪ .2‬הפרק ילמד תוך ביצוע משימות מובנות ומשימות התנסות חופשית בסביבה‬
‫דרכי הערכה‪:‬‬
‫‪ .1‬בחינה מעשית – הכנת אתר עם ‪ 5‬דפים לפחות‪ .‬שימוש בכל התגיות שנלמדו‬
‫‪ .2‬בוחן תאורטי – מה הקוד מבצע והשלמת פקודות לקטע קיים‬
‫חלוקת השעות‬
‫סה"כ שעות‬
‫שעות התנסות שעות עיוניות‬
‫הנושא‬
‫הכרת סביבת העבודה‬
‫‪1‬‬
‫‪1‬‬
‫‪4‬‬
‫‪4‬‬
‫הוראות תנועה והוראות מראה‬
‫סה" כ שעות‬
‫‪5‬‬
‫‪1‬‬
‫‪4‬‬
‫‪4‬‬
‫פרק ‪ :2‬מבוא לאלגוריתמיקה ‪JavaScript -‬‬
‫להכיר את סביבת העבודה בה ילמד המודול ולבנות קוד בן מספר פקודות סדרתיות‪.‬‬
‫‪.‬‬
‫מטרות ביצועיות‪:‬‬
‫‪ .1‬התלמיד יכיר תגית ‪script‬‬
‫‪ .2‬התלמיד ידע היכן נכתבת תגית ‪ script‬ומתי הנכתב בה מתבצע‬
‫‪ .3‬התלמיד ידע לשלב קוד ‪ JavaScript‬בדף ‪HTML‬‬
‫‪ .4‬התלמיד יכיר הוראות הדפסה ב ‪JavaScript -‬‬
‫‪ .5‬התלמיד ידע מתי להשתמש בהוראת הדפסה של ‪ html‬ומתי בהוראת הדפסה של ‪JS‬‬
‫מושגים והכוונה‪:‬‬
‫‪ .1‬הודעה מוקפצת‬
‫‪ .2‬שילוב הוראת כתיבה ב ‪ JS -‬וגם הוראת כתיבה ב ‪ HTML -‬באותו קוד‬
‫דרכי ההוראה‪:‬‬
‫‪ .1‬הפרק יילמד הן בכיתה והן במעבדה‬
‫‪ .2‬בכיתה יוצג מדוע משלבים ‪ JS‬ומהם היתרונות לכך‬
‫‪ .3‬במעבדה יודגמו אירועים בהם משתמשים ב ‪JS-‬‬
‫‪ .4‬הפרק יציג את הוראות הפלט הבסיסיות בסביבת העבודה‬
‫דרכי הערכה‪:‬‬
‫‪ .1‬בחינה מעשית – כתיבת קוד והרצתו בהתאם למטלת המורה‬
‫‪ .2‬בוחן תאורטי – מה הקוד מבצע והשלמת פקודות לקטע קיים‬
‫חלוקת השעות‬
‫שעות התנסות שעות עיוניות‬
‫הנושא‬
‫‪1‬‬
‫‪ JavaScript‬לשם מה?‬
‫הוראת כתיבה ב ‪ JS -‬ושילובה בקוד ‪HTML‬‬
‫‪2‬‬
‫סה" כ שעות‬
‫‪2‬‬
‫‪1‬‬
‫סה"כ שעות‬
‫‪1‬‬
‫‪2‬‬
‫‪3‬‬
‫‪5‬‬
‫פרק ‪ :3‬משתנים קלט‪/‬פלט וחישובים‬
‫מטרת הפרק‬
‫להכיר משתנים מטיפוס שלם וחישובים בסיסיים עליהם‪.‬‬
‫ללמוד לקלוט נתונים ולהמיר אותם לסוג הנתונים הנדרש‪.‬‬
‫מטרות ביצועיות‪:‬‬
‫‪.1‬‬
‫‪.2‬‬
‫‪.3‬‬
‫‪.4‬‬
‫‪.5‬‬
‫התלמיד יכתוב קוד בסיסית הכולל לפחות משתנה אחד (ללא ביצוע פעולות חישוב)‬
‫התלמיד יבצע קלט למשתנה ויציג את ערכו (ללא פעולות נוספות)‬
‫התלמיד ימיר ערך שנקלט למשתנה כטקסט לסוג ערך מבוקש שלם‪/‬עשרוני‪/‬טקסט‬
‫התלמיד יגדיר את המשתנים המתאימים לאלגוריתם‪ ,‬הגדרתם והצבת ערך‬
‫התלמיד יבצע פע ולות חישוב בסיסיות על קלט ערכים‬
‫מושגים והכוונה‪:‬‬
‫‪.1‬‬
‫‪.2‬‬
‫‪.3‬‬
‫‪.4‬‬
‫‪.5‬‬
‫‪.6‬‬
‫נתון‪ ,‬משתנה‪.‬‬
‫קלט‪ ,‬קלט ממקלדת‪ ,‬פעולות על קלט‪ ,‬פעולות על סדרת קלטים‪ ,‬נכונות של קלט‬
‫פלט‪ ,‬פלט לצג‪ ,‬נכונות של פלט‪ ,‬פלט ביניים (לבדיקת האלגוריתם)‬
‫טיפוס משתנה עשרוני – שלם ‪ -‬טקסט‬
‫שימוש בפעולות חשבון בסיסיות‪ .‬סעיף זה אינו עומד בפני עצמו אלא כמשולב תוכן‬
‫אופרטורים מנה ושארית חלוקה‪ .‬סעיף זה אינו עומד בפני עצמו אלא כמשולב תוכן‬
‫דרכי ההוראה‪:‬‬
‫‪ .1‬הפרק הוא המשך לפרק הקודם במובן שבו מתרחב האלגוריתם ומתווסף לו המשתנה‬
‫‪ .2‬יש להציג את מושג המשתנה‪ ,‬טיפוסי משתנים והשימוש במשתנים‬
‫‪ .3‬יש לתרגל באופן מעמיק את נושא המשתנים ופעולות בסיסיות עליהם‬
‫‪ .4‬יש להדגיש שבחירת טיפוסי המשתנים היא חלק מפיתוח הקוד ותיעודה‪.‬‬
‫דרכי הערכה‪:‬‬
‫‪ .1‬בחינה במעבדה ‪ -‬הצגת שאלה פשוטה (קלט של שני ערכים וביצוע פונקציה מתמטית)‬
‫‪ .2‬בחינה עיונית – מעקב אחר קוד פשוט‬
‫חלוקת השעות‪:‬‬
‫הנושא‬
‫משתנים וטיפוסי נתונים‬
‫קלט ‪ /‬פלט‬
‫פעולות בסיסיות על מספרים‬
‫סה" כ שעות‬
‫שעות התנסות‬
‫‪2‬‬
‫‪2‬‬
‫‪3‬‬
‫‪7‬‬
‫שעות עיוניות‬
‫‪1‬‬
‫‪1‬‬
‫סה"כ שעות‬
‫‪3‬‬
‫‪2‬‬
‫‪3‬‬
‫‪8‬‬
‫‪6‬‬
‫פרק ‪ :4‬משפטי תנאי – ביצוע מותנה‬
‫מטרת הפרק‬
‫להכיר את מבנה הבקרה של ביצוע מותנה ומרכיביו ולהכיר אלגוריתמים עם ביצוע מותנה‪.‬‬
‫מטרות ביצועיות‪:‬‬
‫‪.1‬‬
‫‪.2‬‬
‫‪.3‬‬
‫‪.4‬‬
‫‪.5‬‬
‫התלמיד יגדיר‪/‬יכתוב קוד הכולל משפט תנאי פשוט הכולל אם‪ ...‬אז‪ ...‬אחרת‪ ,‬בצורתו הפשוטה‬
‫ביותר‬
‫התלמיד יגדיר‪/‬יכתוב מבנה תנאי פשוט (קינון ברמה אחת) הכולל קשרים בוליאניים (לא‪ ,‬או‪ ,‬וגם)‬
‫התלמ יד יבחין בסדר הפעולות הבוליאני‬
‫התלמיד י רשום טבלת אמת לתנאי נתון וליצור תנאי על פי טבלת אמת‬
‫התלמיד יעקוב אחר אלגוריתם מילולי‬
‫מושגים והכוונה‪:‬‬
‫‪.1‬‬
‫‪.2‬‬
‫‪.3‬‬
‫‪.4‬‬
‫‪.5‬‬
‫תנאי פשוט‪ ,‬תנאי מורכב‪ ,‬הסתעפות‬
‫טבלת אמת‪ :‬שלילה‪ ,‬או‪ ,‬וגם‬
‫שוויון‪ ,‬גדול מ‪ ,‬קטן מ‪ ,‬לפחות‪ ,‬לכל היותר‪ ,‬אי שוויון‬
‫תקינות קלט‪ ,‬מסננת קלט פשוטה הכולל תנאי בלבד‬
‫אלגוריתם מילולי‪/‬פסאדו קוד‬
‫דרכי ההוראה‪:‬‬
‫‪ .1‬הפרק הוא המשך לפרקים הקודמים במובן שבו מתרחב האלגוריתם‬
‫‪ .2‬יש ללמד ביטויים בול יאניים פשוטים כבסיס למשפטי תנאי‬
‫‪ .3‬בדוגמאות יהיו גם אלגוריתמים מילוליים וגם קטעי קוד‪ .‬ביצוע קוד יודגם באמצעות טבלאות‬
‫מעקב‬
‫דרכי הערכה‪:‬‬
‫‪ .1‬בחינה במעבדה – לכתוב קוד הכולל תנאי פשוט ותנאי מורכב‬
‫‪ .2‬בחינה עיונית – ניתוח אלגוריתם (קוד ו‪/‬או אלגוריתם מילולי‪/‬פאסדו קוד)‬
‫חלוקת השעות‬
‫הנושא‬
‫ביטויים בוליאניים‬
‫משפטי תנאי‬
‫סה" כ שעות‬
‫שעות התנסות‬
‫‪1‬‬
‫‪3‬‬
‫‪4‬‬
‫שעות עיוניות‬
‫‪1‬‬
‫‪1‬‬
‫סה"כ שעות‬
‫‪1‬‬
‫‪3‬‬
‫‪4‬‬
‫‪7‬‬
‫פרק ‪ :5‬ביצוע חוזר‬
‫מטרת הפרק‬
‫להכיר את רעיון ביצוע חוזר תוך מתן דגש על הוראות אלגוריתם סדרתי‪.‬‬
‫מטרות ביצועיות‪:‬‬
‫‪ .1‬התלמיד יזהה בעיות שפתרונן דורש ביצוע חוזר‬
‫‪ .2‬התלמיד יבחין בין בעיה הדורשת פתרון בביצוע חוזר באורך ידוע מראש לבין בעיה הדורשת פתרון‬
‫בביצוע חוזר מותנה‬
‫‪ .3‬התלמיד יסביר את הצורך בתנאי הסיום של לולאה מותנית‬
‫‪ .4‬התלמיד יסביר במילים שלו את נכונות האלגוריתם המתבסס על ביצוע חוזר‬
‫‪ .5‬התלמיד יכתוב קוד ובו ביצוע חוזר מוגבל מראש‬
‫‪ .6‬התלמיד יכתוב קוד ובו ביצוע חוזר מותנה‬
‫‪ .7‬התלמיד יסביר את ההבדלים בין פעולות ביצוע חוזר (ביצוע חוזר מוגבל מראש‪ ,‬ביצוע חוזר מותנה)‬
‫‪ .8‬יש לשלב משתנים בתוכניות עם ביצוע חוזר‬
‫‪ .9‬התלמיד יכתוב לולאה מותנית שתנאי העצירה שלה תלוי משתנה‬
‫מושגים והכוונה‪:‬‬
‫‪ .1‬ביצוע חוזר מוגבל מראש‬
‫‪ .2‬ביצוע חוזר מותנה‬
‫דרכי ההוראה‪:‬‬
‫‪ .1‬הפרק הוא המשך לפרק הקודם במובן שבו מתרחב האלגוריתם ומתווסף לו אלגוריתם ביצוע חוזר‬
‫‪ .2‬יש להדגים ביצוע חוזר באמצעות אלגוריתם מילולי‪/‬פסאודו ‪-‬קוד שאין לו תרגום ישיר לשפת‬
‫התכנות‪ ,‬למשל‪" :‬בצע לכל איבר בקבוצה"‪" ,‬חזור ‪ n‬פעמים"‪ .‬במקרים כאלה ניתן לתרגל גם‬
‫באמצעים לא ממוחשבים‬
‫‪ .3‬יש להציג לולאה פשוטה "חזור ‪ n‬פעמים" לפני לימוד של לולאת ביצוע מותנה‬
‫‪ .4‬יש להדגיש שבביצוע חוזר טקסט האלגוריתם נשאר קבוע‪ ,‬אך הוא משרה תהליכי ביצוע באורכים‬
‫שונים (כולל אורך ‪)0‬‬
‫‪ .5‬יש להדגיש כי יתכן ביצוע שאינו מסתיים (דהיינו בעל אורך אינסופי)‬
‫‪ .6‬יש להדגיש את המשמעות המיוחדת של מושג הנכונות בהקשר של ביצוע חוזר (מילוי אחר התנאים‬
‫הנדרשים בסיום הביצ וע החוזר והבטחת סיום הביצוע)‬
‫‪ .7‬יש לתרגל באופן מעמיק את כל נושא הלולאות‬
‫דרכי הערכה‪:‬‬
‫‪ .1‬בחינה עיונית –‬
‫א‪ .‬מעקב אחר אלגוריתם (קוד וגם אלגוריתם מילולי) המבוסס על ביצוע חוזר‬
‫ב‪ .‬מעקב אחר בעיה וזיהוי סוג הביצוע החוזר הנדרש – אורך ידוע מראש או מותנה‬
‫ג‪ .‬זיהוי מספר הפעמים שתתבצע לולאה נתונה‬
‫ד‪ .‬כתיבת פסאודו ‪-‬קוד או קוד לפתרון בעיה הדורשת ביצוע חוזר‬
‫‪ .2‬בחינה מעשית –‬
‫א‪ .‬לכתוב קוד הכולל ביצוע חוזר מוגבל מראש‬
‫ב‪ .‬לכתוב קוד הכולל ביצוע חוזר מותנה‬
‫חלוקת השעות‬
‫הנושא‬
‫ביצוע חוזר לשם מה?‬
‫ביצוע חוזר מוגדר מראש‬
‫ביצוע חוזר מותנה‬
‫שעות התנסות‬
‫סה" כ שעות‬
‫‪2‬‬
‫‪2‬‬
‫‪4‬‬
‫שעות עיוניות‬
‫‪1‬‬
‫‪1‬‬
‫סה"כ שעות‬
‫‪1‬‬
‫‪2‬‬
‫‪2‬‬
‫‪5‬‬
‫‪8‬‬
‫פרק ‪ :6‬אלגוריתמים מתקדמים‬
‫מטרת הפרק‬
‫לאתגר את התלמיד בהבנת וכתיבת אלגוריתמים מתקדמים המשלבים את התכנים שנלמדו – משתנים‪,‬‬
‫פעולות‪/‬פונקציות ‪ ,‬משפטי תנאי ומשפטי ביצוע חוזר וכוללים תבניות של צוברים‪ ,‬מונים‪ ,‬מספרים‬
‫אקראיים ולולאות מקוננות‪.‬‬
‫מטרות ביצועיות‪:‬‬
‫‪.1‬‬
‫‪.2‬‬
‫‪.3‬‬
‫‪.4‬‬
‫‪.5‬‬
‫התלמיד יכתוב קוד המתבססים על התבניות צובר ומונה‬
‫התלמיד יכתוב קוד המגריל מספר אקראי ומשתמש בו לצורך בהתניות‬
‫התלמיד יזהה בעיות אלגוריתמיות שפתרונן מבוסס על צבירה ומניה‪ ,‬ערכי קיצון – מינימום‬
‫ומקסימום‪ ,‬כולל תנאים מורכבים‬
‫התלמיד יכתוב קוד עם ביצוע חוזר בעל פעילות מצטברת‬
‫התלמיד יכתוב קוד הכולל לולאות מקוננות‬
‫מושגים והכוונה‪:‬‬
‫‪ .1‬מונה‪ ,‬צובר‬
‫‪ .2‬מספר אקראי‬
‫‪ .3‬לולאה מקוננת‬
‫דרכי ההוראה‪:‬‬
‫‪ .1‬הפרק הוא המשך לפרקים הקודמים במובן שבו מתרחב האלגוריתם‬
‫‪ .2‬יש להסביר מהו משתנה אקראי וכיצד ניתן להשתמש בו‬
‫‪ .3‬יש לשלב בתכניות מונים‪ ,‬צוברים ולולאות מקוננות‬
‫דרכי הערכה‪:‬‬
‫‪ .1‬בחינה במעבדה – הצגת שאלה ברמת בגרות שאלון ‪ 899122‬או פרק ב' בשאלון ‪899222‬‬
‫‪ .2‬בחינה עיונית – מעקב אחר קוד והדפסת הפלט‬
‫חלוקת השעות‬
‫הנושא‬
‫מונים וצוברים‬
‫מספרים אקראיים‬
‫לולאות מקוננות‬
‫סה" כ שעות‬
‫שעות התנסות‬
‫‪4‬‬
‫‪2‬‬
‫‪2‬‬
‫‪8‬‬
‫שעות עיוניות‬
‫‪1‬‬
‫‪1‬‬
‫‪2‬‬
‫סה"כ שעות‬
‫‪5‬‬
‫‪2‬‬
‫‪3‬‬
‫‪10‬‬
‫‪9‬‬
‫פרק ‪ :7‬קריאה לפעולות‪/‬פונקציות באמצעות ‪onClick‬‬
‫מטרת הפרק‬
‫להגדיר מספר פעולות‪/‬פונקציות בקוד אחד‪,‬‬
‫‪ - onClick‬להעביר פרמטרים בין תגית טופס בדף ‪ html‬לבין פעולות‪/‬פונקציות ב ‪.JavaScript-‬‬
‫מטרות ביצועיות‪:‬‬
‫‪ .1‬התלמיד יכתוב קוד הכולל‪ 2‬פעולות לפחות‬
‫‪ .2‬התלמיד יכתו ב קוד הכולל שימוש בפעולות‪/‬פונקציות‬
‫‪ .3‬התלמיד יקבל קוד הכולל פעולות‪/‬פונקציות ויתאר מה הקוד עושה‬
‫‪ .4‬שילוב בין ‪ html‬לקוד ‪ JS‬באמצעות ‪onClick‬‬
‫מושגים והכוונה‪:‬‬
‫‪ .1‬ריבוי פעולות ‪ /‬פונקציות‬
‫‪ .2‬יצירת ‪ button‬שבקליק מפעיל פונקציה‬
‫‪ .3‬קלט של מידע ב ‪ JS-‬ע"י טופס ‪html‬‬
‫‪ .4‬תוצאות הפונקציה ב ‪ JS-‬ישתלו בטופס דף ‪html‬‬
‫דרכי ההוראה‪:‬‬
‫‪ .5‬הפרק יילמד הן בכיתה והן במעבדה‬
‫‪ .6‬בכיתה יוצג המושג תכנות מונחה אירועים‬
‫‪ .7‬במעבדה יודגמו אירועים והתגובה אליהם‬
‫‪ .8‬הפרק יציג את האירועים הבסיסיים בסביבת העבודה‬
‫‪ .9‬הפרק יציג את השפעת האירועים על תוכן הטופס שב דף האינטרנט‬
‫דרכי הערכה‪:‬‬
‫‪ .1‬בחינה מעשית – שימוש באירועים להפעלת האובייקטים‬
‫‪ .2‬בחינה עיונית – מעקב אחר קוד פשוטה‬
‫חלוקת השעות‬
‫הנושא‬
‫מהם פעולות‪/‬פונקציות‬
‫תכנות פעולות‪/‬פונקציות‬
‫שעות התנסות‬
‫סה" כ שעות‬
‫‪8‬‬
‫‪8‬‬
‫שעות עיוניות‬
‫‪2‬‬
‫‪2‬‬
‫סה"כ שעות‬
‫‪2‬‬
‫‪8‬‬
‫‪10‬‬
‫‪10‬‬
‫פרק ‪ :8‬גרפיקה ‪Canvas‬‬
‫מטרת הפרק‬
‫הגדרת ‪Canvas‬‬
‫שימוש בפונקציות מוכנות ליצירת צורות הנדסיות פשוטות (עיגול‪ ,‬מלבן‪ ,‬קו)‬
‫יצירת צורות מורכבות באמצעות הפונקציות הבסיסיות‬
‫מטרות ביצועיות‪:‬‬
‫‪ .1‬שילוב בין ‪ html‬לקוד ‪ JS‬והגדרת תגית ‪canvas‬‬
‫‪.2‬‬
‫‪.3‬‬
‫‪.4‬‬
‫‪.5‬‬
‫‪.6‬‬
‫התלמיד יכתוב קוד הכולל שימוש בכל ההוראות ליצירת צורות הנדסיות פשוטות‬
‫התלמיד ידע ליצור צורות מורכבות באמצעות הפונקציות הבסיסיות‬
‫התלמיד ידע לשלב משתנים באופרטורים של ההוראות ליצירת צורות‬
‫התלמיד ידע לשלב לולאות עם הוראות גרפיקה‬
‫התלמיד יקבל קוד הכולל פעולות‪/‬פונקציות ויתאר מה הקוד עושה‬
‫מושגים והכוונה‪:‬‬
‫‪ .1‬שימוש בפונקציות גרפיות מוכנות ב ‪Canvas-‬‬
‫‪ .2‬הבנת תפקיד אופרטורים ושימוש מושכל ללא היחשפות לקוד הפונקציה‬
‫‪ .3‬שימוש בלולאות ‪ /‬משתנים ביצירת גרפיקה‬
‫דרכי ההוראה‪:‬‬
‫‪ .1‬הפרק יילמד הן בכיתה והן במעבדה‬
‫‪ .2‬בכיתה יוצג המושג ציר המספרים בהתאם למונחי ה ‪Canvas -‬‬
‫‪ .3‬במעבדה יודגמו לולאות בשילוב הוראות גרפיקה‬
‫דרכי הערכה‪:‬‬
‫‪ .1‬בחינה מעשית – שימוש בפונקציות גרפיות מוכנות ליצירת צורה מורכבת תוך שימוש בלולאות‬
‫ומשתנים‬
‫‪ .2‬בחינה עיונית – מעקב אחר קוד המכיל הוראות גרפיות משולבות משתנים ולולאות‬
‫חלוקת השעות‬
‫הנושא‬
‫תגית ‪ Canvas‬וגרפיקה פשוטה‬
‫הוראות גרפיות משולבות משתנים ולולאות‬
‫סה" כ שעות‬
‫שעות התנסות‬
‫‪4‬‬
‫‪4‬‬
‫שעות עיוניות‬
‫‪1‬‬
‫‪1‬‬
‫סה"כ שעות‬
‫‪1‬‬
‫‪4‬‬
‫‪5‬‬
‫‪11‬‬
‫פרק ‪ :9‬אנימציה ‪Canvas‬‬
‫מטרת הפרק‬
‫שימוש בכל הנלמד במהלך השנה לכתיבת פרויקט אנימציה בשילוב ‪ Canvas‬המכיל הוראות גרפיות‪,‬‬
‫משתנים‪ ,‬פונקציות‪ ,‬לולאות‬
‫מטרות ביצועיות‪:‬‬
‫‪ .1‬התלמיד יזהה בעיות שפתרונן דורש טיימר ‪ /‬לחיצת עכבר ‪ /‬מעבר עכבר ‪ /‬מקשי חצים‬
‫‪ .2‬התלמיד יסביר את הצורך בטיימר וידע להשתמש בו לפתרון בעיות‬
‫‪ .3‬התלמיד יסביר במילים שלו את נכונות האלגוריתם המתבסס על אירוע לחיצת עכבר ב ‪Canvas -‬‬
‫‪ .4‬התלמיד יכתוב קוד הכולל אירוע לפי תזוזת אלמנט לפי מעבר עכבר‬
‫‪ .5‬התלמיד יכתוב קוד המכיל תזוזת אלמנט לפי מקשי חצים‬
‫מושגים והכוונה‪:‬‬
‫‪ .1‬תזוזת אלמנט לפי טיימר ולוח צירים‬
‫‪ .2‬אירוע לחיצת עכבר ב ‪Canvas -‬‬
‫‪ .3‬תזוזת אלמנט לפי מעבר העכבר‬
‫‪ .4‬תזוזת אלמנט לפי מקשי חצים‬
‫דרכי ההוראה‪:‬‬
‫‪ .1‬הפרק הוא המשך לפרק הקודם במובן שבו מתרחבת הגרפיקה לאנימציה ומתווספים לו אירועים‬
‫‪ .2‬יש להדגים אירוע באמצעות פסאודו ‪-‬קוד נייטרלי שאין לו תרגום ישיר לשפת התכנות‪ ,‬למשל‪:‬‬
‫" כאשר מקליקים בעכבר"‪ " ,‬כאשר לוחצים על מקש"‪ .‬במקרים כאלה ניתן לתרגל גם באמצעים לא‬
‫ממוחשבים‬
‫‪ .3‬יש להציג כל אירוע בנפרד ולאחר מכן לתת לתלמיד לבצע תרגיל מורכב תוך שימוש באירוע הנלמד‬
‫‪ .4‬יש לתרגל באופן מעמיק את כל נושא האירועים‬
‫דרכי הערכה‪:‬‬
‫‪ .2‬בחינה עיונית –‬
‫א‪ .‬מעקב אחר אלגוריתם (קוד וגם אלגוריתם מילולי) המבוסס על אנימציה ‪Canvas‬‬
‫ב‪ .‬מעקב אחר בעיה וזיהוי סוג האירוע הנדרש – טיימר ‪ /‬עכבר ‪ /‬מקשי חצים‬
‫ג‪ .‬כתיבה‪/‬השלמה של פסאו דו קוד או קוד לפתרון אנימציה בשילוב אירוע‬
‫‪ .3‬בחינה מעשית –‬
‫ג‪ .‬לכתוב קוד עבור כל אירוע בנפרד‬
‫ד‪ .‬לכתוב משחק ‪ -‬פרויקט אישי המכיל ‪ 2‬אירועים שונים לפחות‬
‫חלוקת השעות‬
‫הנושא‬
‫אירוע טיימר‬
‫אירוע הקלקת‪/‬מעבר עכבר‬
‫אירוע מקלדת‬
‫סה" כ שעות‬
‫שעות התנסות‬
‫‪2‬‬
‫‪3‬‬
‫‪3‬‬
‫‪8‬‬
‫שעות עיוניות‬
‫‪1‬‬
‫‪1‬‬
‫‪2‬‬
‫סה"כ שעות‬
‫‪3‬‬
‫‪4‬‬
‫‪3‬‬
‫‪10‬‬
‫‪12‬‬