1.4 קוד js תרגיל

להלן סדרת תרגילים ללימוד JavaScript בהתאם לפרקי ההרצאה:

תרגיל 1: הכרות בסיסית עם JavaScript

הוראות:
1. צור קובץ HTML עם תגית script פנימית
2. כתוב קוד המדפיס את המשפט "שלום עולם!" לקונסול
3. הוסף כפתור שמציג הודעת alert עם השם שלך כאשר לוחצים עליו
4. שנה את הטקסט של תגית h1 בעמוד באמצעות JavaScript

תרגיל 2: משתנים ואופרטורים

הוראות:
1. הצהר על משתנים עם let, const ו-var והסבר את ההבדלים ביניהם
2. כתוב תוכנית המחשבת את שטח המלבן (אורך * רוחב) ומציגה את התוצאה
3. צור משתנים עם הערכים הבאים והצג את הטיפוס של כל אחד:
- "JavaScript"
- 42
- true
- null
- undefined

תרגיל 3: תנאים ולולאות

הוראות:
1. כתוב פונקציה שמקבלת גיל ומחזירה "קטין" אם הגיל מתחת ל-18, "בוגר" אחרת
2. צור מערך של מספרים והדפס רק את המספרים הזוגיים
3. כתוב קוד שמדפיס את מכפלת המספרים מ-1 עד 10 (עובדיה)
4. השתמש במשפט switch כדי להציג הודעה שונה לפי יום בשבוע

תרגיל 4: פונקציות

הוראות:
1. כתוב פונקציה רגילה שמקבלת שני מספרים ומחזירה את הסכום שלהם
2. כתוב את אותה הפונקציה כפונקציית חץ (arrow function)
3. צור פונקציה עם פרמטר ברירת מחדל
4. כתוב פונקציה רקורסיבית לחישוב עצרת של מספר

תרגיל 5: עבודה עם DOM

הוראות:
1. צור כפתור בדף HTML ובאמצעות JavaScript שנה את צבע הרקע שלו כאשר לוחצים עליו
2. הוסף רשימה (ul) ריקה לדף ומילא אותה עם 5 פריטים באמצעות JavaScript
3. צור טופס עם שדה קלט וכפתור שכאשר לוחצים עליו מוסיפים את הטקסט שכתוב בשדה כתגית p חדשה בדף
4. שנה את הגופן של כל הפסקאות בדף ל-Arial באמצעות JavaScript

תרגיל 6: אירועים

הוראות:
1. צור תמונה שמוחלפת כאשר מעבירים את העכבר מעליה (hover)
2. הוסף אירוע keypress שיבדוק אם נלחץ מקש Enter וידפיס הודעה לקונסול
3. צור div שמשנה צבע כאשר לוחצים עליו ומחזיר לצבע המקורי כאשר משחררים
4. מנוע את הפעולה הטבעית של כפתור submit בטופס והצג את הנתונים בקונסול במקום

תרגיל 7: Debugging

הוראות:
1. כתוב פונקציה עם באג (למשל חילוק באפס) ונעזר ב-Chrome DevTools כדי למצוא את הבעיה
2. הגדר breakpoint בפונקציה וצעד דרך הקוד שלב אחר שלב
3. השתמש ב-con.log כדי לעקוב אחרי ערכים של משתנים בזמן ריצה
4. כתוב קוד שגורם לשגיאה והסתכל על ה-Error object בקונסול

תרגיל 8: Fetch API

הוראות:
1. בצע בקשת GET ל-API ציבורי (למשל https://jsonplaceholder.typicode.com/posts) והצג את התוצאה בקונסול
2. צור טופס שמאפשר שליחת פוסט חדש (POST request) לאותו API
3. הוסף טיפול בשגיאות לבקשות ה-fetch
4. הצג את הנתונים שהתקבלו מה-API כטבלה בדף האינטרנט

תרגיל 9: פרויקט שעון דיגיטלי

הוראות:
1. צור div ריק בדף HTML
2. כתוב פונקציה שמעדכנת את השעה הנוכחית כל שנייה
3. הצג את השעה ב-div שיצרת בפורמט HH:MM:SS
4. הוסף אפשרות להפעיל/לעצור את השעון בלחיצת כפתור

תרגיל 10: אפליקציית מזג אוויר

הוראות:
1. השתמש ב-API מזג אוויר חינמי (למשל OpenWeatherMap)
2. צור טופס שמאפשר להזין שם עיר
3. כאשר שולחים את הטופס, הצג את נתוני מזג האוויר הנוכחיים עבור העיר שהתקבלה
4. הוסף טיפול בשגיאות למקרה שהעיר לא נמצאה
5. עצב את התצוגה עם סמלים ותיאור מתאים למזג האוויר

תרגיל אתגרי: משחק זיכרון

הוראות:
1. צור מערך של זוגות מספרים (למשל [1,1,2,2,3,3])
2. הצג רשת של כרטיסים הפוכים (באמצעות divים)
3. כאשר לוחצים על כרטיס, הוא מתהפך ומראה את המספר
4. אם שני כרטיסים זהים נבחרו, הם נשארים גלויים
5. הוסף מונה תורות ומנגנון לסיום המשחק כאשר כל הזוגות נמצאו