תנאי If-Then-Else ב-Javascript
if מקבלת תנאי בסוגריים, והבלוק שלה מתבצע רק אם התנאי נכון. else מבצע את הבלוק שלו כשהתנאי לא מתקיים.else if. הבדיקה מתחילה בתנאי הראשון ומבצעת את הבלוק הראשון שמתקיים. אם אף תנאי לא מתקיים, מבצעים את ה-else האחרון, או מוותרים עליו.&& (AND) דורש שכל התנאים יתקיימו, || (OR) מספיק שאחד מהם יתקיים, ו-! (NOT) הופך את התוצאה. AND נבדק לפני OR, כי לו יש קדימות.case צריך להסתיים ב-break, אחרת הביצוע ממשיך לקייס הבא, כמו מפל מים. אפשר לאחד כמה case בלי קוד ביניהם, ו-default מבצע כשאף case לא מתאים.if (num > 50), else if, switch (n), case 10:, break;, default:, result = (a > b) ? a : b.if על 0 לא יתבצע. בתנאי עם פקודה אחת אפשר לוותר על הבלוק, אבל מומלץ תמיד לפתוח בלוק כדי שהקוד יהיה קריא ובטוח בכל דפדפן. ב-switch בודקים שוויון לערך בלבד, ולא טווח כמו גדול מ.להורדת קוד מקור של כל הדוגמאות בקורס JAVA SCRIPT למתחילים -לחץ כאן לתלמידי המכללה בלבד
להורדת קוד מקור של כל הדוגמאות בקורס JAVA SCRIPT למתקדמים- לחץ כאן לתלמידי המכללה בלבד
פרקי ההרצאה: תנאי If-Then-Else ב-Javascript
תמלול ההרצאה: תנאי If-Then-Else ב-Javascript
הטקסט המלא של הדקות הראשונות בהרצאה «תנאי If-Then-Else ב-Javascript» בקורס הווידאו של PracticU – כתוביות בעברית עם זמן התחלה לכל פסקה. כך תוכלו לקרוא ולחפש את הנושאים לפני שמתחילים ללמוד.
הדבר הבא שאנחנו הולכים לראות בג'אווה סקריפט נקרא Conditions. כלומר איך אנחנו יכולים לכתוב קטע קוד שבעצם מאפשר לבדוק האם תנאי מסוים מתרחש כן או לא.
אם התנאי מתרחש אז אנחנו בעצם רוצים לבצע פעולה מסוימת, אם התנאי לא מתרחש או שווה false אנחנו רוצים לבצע דבר אחר.
אז בואו נסתכל קודם כל איפה קיים דבר כזה במציאות. אם אני פותח נניח דפדפן וגולש לדוגמה ל gmail אז אני רואה שיש לי פה תיבת טקסט להכניס יוזרניים ותיבת טקסט להכניס פספורט.
בוא נניח שאני עכשיו לוחץ על הלחצן to sign in ולא מכניס כלום בתיבת היוזרניים. אז אני רואה אוטומטית שמוצגת לי הודעה enter your email address. ההודעה הזאתי הוצגה מיידית וזה אומר שלא התבצע שום ריצה לשרת אלא JavaScript בצד הלקוח בדקה האם תיבת הטקסט ריקה אם כן הציגה לי את ההודעה
הזאת. אם לא אז כמובן היא לא הייתה מציגה לי את ההודעה הזאת לדוגמה אם הייתי רושם מוישה@gmail.com ולוחץ על סיינינג, אז כמובן שההודעה לא הייתה מוצגת לי לגבי היוזרניים אלא לגבי הפספורט, כאילו הכנסתי סיסמה.
אם הייתי עכשיו מכניס סיסמה ולוחץ סיינינג, ג'אווה סקריפט לא הייתה מסוגלת לבדוק האם היוזרניים והסיסמה הם נכונים, מפני שהמידע הזה נשמר כמובן בשרת. ג'אווה סקריפט רק הייתה בודקת האם אכן הכנסתי סיסמה.
אם כן היא לא הייתה מציגה לי את ההודעה הזאת והייתה מתבצעת ריצה לצד השרת אבל אז היא הייתה מוצגת לי הודעה אחרת The username or password you entered is incorrect זה כמובן מקרה שבו השרת בדק את זה והחזיר הודעה ללקוח ואנחנו מתחילים לראות איך ב-JavaScript אנחנו יכולים לבצע את הבדיקה הזאת
בכדי לדעת האם מידע שאנחנו רוצים אכן מתקיים או לא מתקיים או האם איזשהו תנאי מתקיים או לא מתקיים אוקיי, אז יש לנו כאן סקריפט ובואו נניח שיש לי פה איזשהו משתנה שהכנסתי בו איזשהו ערך.
אני עכשיו רוצה לבדוק האם המשתנה הזה שווה לערך מסוים. אז יש לי קודם כל אפשרות להשתמש בפקודה if. if, סוגריים, ואני רושם בתוכה את התנאי. האם num, בוא נניח, יותר גדול מ-50.
אם כן, אני יכול לפתוח בלוק ולכתוב בתוך הבלוק את הפקודות שאני רוצה. הפקודות האלה יתבצעו כמובן אם num יותר גדול מ-50.
לדוגמה, alert num is bigger than 50. אני יכול עכשיו, עכשיו להוסיף גם אלס. האלס יתבצע במצב שבו num לא יהיה יותר גדול מ-50.
בואו נבדוק. num is smaller or equal to 50. בואו נבדוק את הקוד. נריץ. אנחנו רואים ש-num is bigger than 50, התיבה היחידה שמוצגת לנו.
בואו ננסה להכניס ב-num ערך שהוא קטן מ-50, דוגמה 30. נשמור. אנחנו יכולים אפילו לחזור לדפדפן ולרפרש אותו, ואז הדפדפן ירוץ מחדש, כאשר הפעם num is smaller or equal to 50.
אוקיי, אז מה שעשינו פה זה השתמשנו עם האופרטור גדול מ... אבל איזה עוד אופרטורים קיימים לנו?
אז אנחנו יכולים להשתמש עם האופרטורים הבאים גדול מ... קטן מ... גדול שווה... קטן או שווה... שווה... שונה.
האופרטורים האלה נקראים אופרטורים השוואתיים או Comparison Operators והם מאפשרים לנו לבדוק מגוון של דברים האם ערך גדול מערך אחר, קטן, גדול שווה, קטן שווה, שווה או שונה מערך אחר.
אוקיי, מה קורה אם אני רוצה לבצע? מספר תנאים, בואו נשכפל את הif הזה למצב קצת אחר. אני רוצה לבדוק האם num, בוא נניח, שווה ל-10.
אם כן, num is equal to 10. אני יכול כאן לרשום אלף if, ובif לתת תנאי אחר, האם num שווה ל-20? אם כן, אלרט num is equal to 20. וככה אני יכול להמשיך עם אלף if כמה שאני רוצה.
אני יכול להרחיב את הif בצורה כזאת. לדוגמה, האם num שווה ל-30? אלף if בכלל, נאם יותר קטן מאפס נאם is נגטיב וכולי לבסוף אני יכול שיהיה לי אלס אחד שהאלס הזה יתקיים אם אף אחד מהאיפים לא יתבצע זאת אומרת שהמנגנון הזה שאנחנו רואים כאן עדיין מנגנון איף בודק האם התנאי הראשון מתקיים אם כן הוא מבצע אותו ולא נכנס לאף אחר לאף אחד אחר מפני שכל
היתר שייכים לאלסים אם התנאי הראשון לא מתבצע הוא בודק את התנאי השני מבצע אם הוא מתבצע הוא מבצע אותו אם לא הוא ממשיך הלאה וכולי אם הוא לא מצא אף אחד מהתנאים האלה הוא נכנס לאלף ומבצע אותו, מי כמובן יכול לוותר על האלף.
בואו נבדוק כרגע כאשר num שווה ל-30, נרפרש את הדפדפן ונראה שהוא כותב לי num is equal to 30. בואו נכניס מינוס 30, נרפרש ונראה num is negative. אז בעצם כאן השתמשנו במשפט תנאי if.
קיים כמובן תנאי מורכב, מה זה אומר תנאי מורכב? תנאי מורכב זה תנאי שקיים עם מספר תתי תנאים. לדוגמה, יש לי כאן var a ו-var b.
אני רוצה לבדוק משהו לגבי שני התנאים, ואני יכול לבצע תנאי עבור a, האם a יותר גדול מ-10, ואני רוצה לבדוק גם משהו לגבי b.
כאן אני יכול להשתמש באופרטור תנאי מורכב, לדוגמה end, האם b יותר גדול מ-20. מה שJavaScript תבצע זה תבדוק ששני התנאים בכדי לבצע את ה-if.
בואו נבדוק, ואנחנו רואים שמוצגת לנו ההודעה yes. אנחנו יכולים לבצע תנאי כזה. האם יותר גדול מ-10 יותר גדול מ-20. כאן מספיק שאחד משני התנאים האלה יתבצע, המערכת תחזיר true בכל הif הזה ולכן תבצע את הif.
בואו נסתכל על זה, נניח ש-a לא יותר גדול מ-10, a שווה ל-1, b יותר גדול מ-20 שווה 22, זה מספיק בשביל שהתנאי yes יתבצע.
עושים פה סימן קריאה, ניגש לדפדפן, נפרש אותו ואנחנו רואים שהתנאי התבצע. רק אם שני תתי התנאים שווים false, בעצם האיף לא יתפצע.
אפשרות נוספת זה אפשרות להשתמש בתנאי NOT. תנאי NOT בודק היפוך של תנאי. אני עכשיו רושם את הדבר הבא: האם A שווה ל-1?
אם כן, A = 1. זאת אומרת שכרגע A שווה ל-1 ואנחנו הולכים לראות את ההודעה הזאת. A = 1. אוקיי, אבל מה היה קורה אם הייתי לוקח את התנאי הזה, שם אותו בסוגריים ושם פה NOT?
אז מה שקורה, המערכת לוקחת את ה-NOT והופכת את התנאי. אם התנאי הזה שווה ל-True, ה-NOT יהפוך אותו ל-False ואז כמובן האיף לא יתבצע. אם התנאי הזה שווה ל-False, המערכת תהפוך אותו ל-True והתנאי הזה כן יתבצע.
זאת אומרת שאנחנו ניכנס לתוך התנאי כאשר A not equals 1. בואו נבדוק כרגע ונראה שהמשפט הזה לא יתבצע, ההודעה לא תתבצע כאשר אני מרפרש את הדפדפן.
נשים ב-A 10, נרפרש שוב פעם את הדפדפן ונראה שמוצג לי A not אני כמובן יכול לרשום מספר תתי תנאים, האם a יותר גדול מ-3 וגם b שווה 8 או a שווה b and a גדול שווה 4 וכו' וכו'.
מה שהמערכת עושה, ישנה קדימות אופרטורים, אופרטור end חזק יותר מאופרטור or ולכן המערכת תבדוק קודם כל את התשלובת של ה-ending.
אז המערכת תבדוק את שני אלה, תחזיר תשובה, לאחר מכן תבדוק את שני אלה, תחזיר תשובה ולאחר מכן תבצע אור עם כולם ביחד.
בעצם ביצענו כרגע מספר אפשרויות לגבי האופרטור if, או יותר נכון הפקודה if, כאשר השתמשנו ב-if-else ובמספר תתי תנאים.
האופרטורים הלוגיים שראינו נקראים LogicOperators ויש לנו את end, יש לנו את or ויש לנו את not. עכשיו, מה לגבי שיטה אחרת לבצע תנאים?
אנחנו יכולים לקחת משתנה, ליתר דיוק כבר, ולהכניס לתוכו איזשהו ערך. במידה ואני רוצה לבצע מספר פעולות כתלות במשתנה הזה בלבד, יש לי אפשרות להשתמש במנגנון אחר שנקרא מנגנון סוויץ'.
בואו לא ניקח num, ניקח n, כי כבר יש לנו num למעלה. אם הייתי משתמש במנגנון if עבור n בלבד, אז היה לי מקרה דומה למקרה שראינו מקודם.
קודם בדקנו את num ובדקנו מספר דברים לגביו. האם הוא שווה ל-10, אחרת האם הוא שווה 20, אחרת האם הוא שווה 30 וכולי. אם אני רוצה לבצע השוואות בלבד רק עבור num, יותר נוח לי לא להשתמש במנגנון if-else אלא להשתמש במנגנון סוויץ'.
בואו נסתכל איך עושים את זה. מנגנון סוויץ' אומר דבר כזה. אני רושם את המילה סוויץ' ולאחר מכן אני רושם את שם המשתנה שאני רוצה לבדוק.
פותח בלוק ורושם בתוך הבלוק את הדבר הבא case ואז רושם את הערך שאני רוצה לבצע השוואה לגביו. בוא נניח 10 נקודותיים ואת הקוד שאני רוצה כאשר אני רוצה לבצע שבמידה ו-num שווה ל-10.
לדוגמה alert 10. לאחר מכן break בכדי לגרום