From 95aca4b4d8fa62815d4bd412fff1a364f842814a Mon Sep 17 00:00:00 2001 From: Ryan Johnson Date: Thu, 29 Apr 2021 16:16:42 -0700 Subject: remove retired locales (#699) --- .../learn/javascript/first_steps/math/index.html | 427 --------------------- 1 file changed, 427 deletions(-) delete mode 100644 files/he/learn/javascript/first_steps/math/index.html (limited to 'files/he/learn/javascript/first_steps/math') diff --git a/files/he/learn/javascript/first_steps/math/index.html b/files/he/learn/javascript/first_steps/math/index.html deleted file mode 100644 index e5c22c141f..0000000000 --- a/files/he/learn/javascript/first_steps/math/index.html +++ /dev/null @@ -1,427 +0,0 @@ ---- -title: מתמתיקה בסיסית ב-JavaScript - מספרים ואופרטורים -slug: Learn/JavaScript/First_steps/Math -translation_of: Learn/JavaScript/First_steps/Math ---- -
{{LearnSidebar}}
- -
{{PreviousMenuNext("Learn/JavaScript/First_steps/Variables", "Learn/JavaScript/First_steps/Strings", "Learn/JavaScript/First_steps")}}
- -

בשלב זה של הקורס, נדון קצת במתמתיקה שבשפת JavaScript - איך אנחנו יכולים להשתמש ב - {{Glossary("Operator","operators")}} ועוד אפשרויות על מנת להצליח לבצע מניפולציות וחישובים שונים על מספרים לצרכים שלנו

- - - - - - - - - - - - -
ידע מוקדם:הבנה בסיסית של מחשב, הבנה בסיסית של  HTML, CSS ו - JavaScript.
מטרה:הכרות עם שימוש במתמתיקה באופן בסיסי ב-JavaScript.
- -

כולנו אוהבים מתמטיקה

- -

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

- -

מאמר זה ידון רק בחלקים הבסיסים שאנחנו צריכים לדעת כרגע.

- -

סוגי מספרים

- -

בתכנות, אפילו המספר העשרוני שאנחנו מכירים, הוא יותר מורכב ממה שנאחנו חושבים. אנחנו מתשמשים במושגים שונים על מנת לתאר סוגים שונים של מספרים עשרוניים. לדוגמא:

- - - -

יש לנו אפילו כמה מערכות של מספרים! לדוגמא, מערכת מספרים דצימלית היא מבוססת על בסיס 10, כלומר, היא עושה שימוש בספרות 0-9 בכל עמודה. אבל יש עוד. לדוגמא:

- - - -

לפני שאתם מתחילים לחשוש ולהתבלבל, תנשמו. נדיר שנשתמש במספרים שאינם מספרים דצימליים.

- -

חדשות טובות נוספות הן שלא כמו בשפות תכנות אחרות, לשפת JavaScript יש רק סוג מידע אחד עבודה מספרים - {{jsxref("Number")}}. כלומר, לא משנה איזה סוג מספרים אנחנו נקבל/נזין בקוד, אנחנו נטפל בו בדיוק באותה צורה.

- -

זה הכל מספרים

- -

בוא נשחק קצת עם המספרים ונבין את הסינטקס הבסיסי שנצטרך. הכניסו את הקוד הבא לקונסולה:

- -
    -
  1. קודם כל, נצהיר על שני משתנים ונשים בהם ערכים. לאחר מכן נזין את שמות המשתנים בקונסולה לוודא שהערכים הושמו כראוי: -
    let myInt = 5;
    -let myFloat = 6.667;
    -myInt;
    -myFloat;
    -
  2. -
  3. מספרים אלו בעצם ערכים שנרשמים ללא גרשיים - נסו להזין מספרים עטופים בגרשיים וראו מה קורה.
  4. -
  5. בוא נבדוק האם הערכים השונים שהזנו הם מאותו סוג. האופרטור שבודק את זה הוא {{jsxref("Operators/typeof", "typeof")}}. רשמו את הקוד הבא מתחת לקוד הנוכחי: -
    typeof myInt;
    -typeof myFloat;
    - אתם אמורים לקבל "number" בשני המקרים. ברור לנו שעיסוק בסוג מספר אחד הרבה יותר קל מאשר עם כמה סוגים.
  6. -
- -

Arithmetic operators - אופרטורים מתמתטיים

- -

אופרטורים מתמטיים הם האופרטורים הבסיסים שאנחנו משתמשים בהם על מנת לבצע חישובים:

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
אופרטורשםמטרהדוגמא
+חיבורחיבור6 + 9
-חיסורחיסור20 - 15
*כפלכפל3 * 7
/חילוקחילוק10 / 5
%שארית -

השארית מחלוקת שני מספרים

-
-

8 % 3 (מחזיר 2, שכן 3 נכנס ב- 8 פעמיים, והשארית היא 2,).

-
**חזקהמכפיל את ה-base ב-מעריך , לדוגמא, המספר שיהיה נקוב ב- base עם המספר שיהיה נקוב ב- מעריך יגרום להכפלה של המספר שבבסיס כפול המספר שבמעריך. הוצג לראשונה ב- EcmaScript 2016.5 ** 5 (מחזיר 3125, שזה זהה ל- 5 * 5 * 5 * 5 * 5).
- -
-

לתשומת לב: לפעמים ניתקל במספרים המעורבים בחישובים כ- {{Glossary("Operand", "operands")}}.

-
- -
-

לתשומת לבד: לפעמים אנחנו נראה שמשתמשים במתודה הישנה {{jsxref("Math.pow()")}} אשר פועלת בדרך דומה. לדוגמא, בקוד Math.pow(7, 3), 7 הבסיס הוא 7 ו-3 הוא המעריך בחזקה, והתוצאה תהיה 343. Math.pow(7, 3) is שזה שווה ל- 7**3.

-
- -

כנראה לא צריך ללמד אתכם מתמתיקה בסיסית, אבל אנו רוצים לוודא את ההבנה שלכם לגבי הסינטקס. נסו להכניס את הדוגמאות הבאות לקונסולה על מנת להכיר את הסינטקס.

- -
    -
  1. הכניסו דומאות פשוטות כמו: -
    10 + 7
    -9 * 8
    -60 % 3
    -
  2. -
  3. אתם גם יכולים לנסות להצהיר על משתנים להשים להם מספרים כערכים, ונסו לעשות עליהם חישובים - המשתנים יתנהגו בדיוק כמו שיתנהגו הערכים שהם מחזיקים בהם. כך לדוגמא: -
    let num1 = 10;
    -let num2 = 50;
    -9 * num1;
    -num1 ** 3;
    -num2 / num1;
    -
  4. -
  5. נסו להזין קצת ביטויים יותר מורכבים, כמו: -
    5 + 10 * 3;
    -num2 % 9 * num1;
    -num2 + num1 / 8 + 2;
    -
  6. -
- -

כפי ששמתם לב, חלק מהחישובים שביצענו מחזירים לנו תוצאה בהתאם לכללי הקדימות המתמטיים:

- -

סדר עדיפות אופרטורים

- -

אם נסתכל על הדוגמא למעלה, נניח ש- num2 הוא 50 ו- num1 הוא 10 :

- -
num2 + num1 / 8 + 2;
- -

בני אדם רגילים עלולים להניח ש- "50 ועוד 10 שווה 60", ואז "8 ועוד 2 שווה 10", ואז "60 חלקי 10 שווה 6".

- -

אבל הדפדפן הולך לפי כללי החישוב המתמטים "10 חלקי 8 שווה 1.25", ואז "50 עוד 1.25 ועוד 2 שווה 53.25".

- -

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

- -

אם נרצה לעקוף זאת, נצטרך לעשות שימוש בסוגריים רגילות סביב לחלקים שנרצה לבצע קודם. כך, על נת לקבל את התוצאה של 6, נצטרף לרשום את הקוד בצורה כזאת:

- -
(num2 + num1) / (8 + 2);
- -

נסו כדי לראות.

- -
-

לתשומת לב: רשימה מלאה של האופטורים ב- JavaScript וסדר העדיפות שלהם ניתן למצוא בביטויים ואופרטורים.

-
- -

אופרטים להעלאה/הורדה - Increment and decrement operators

- -

לפעמים אנחנו רוצים להוסיף לערך או להוריד ממנו מספר אחד. ניתן לבצע זאת בקלות באמצעות שימוש באופרטור (++) לצורך העלאה ב-1 ובאופרטור (--) לצורך הורדה ב-1. השתמשנו באופרטור ++ במשחק שלנו  "Guess the number" ב-מבט ראשוני ל- JavaScript כאשר הוספנו אחד למשתנה guessCount על מנת לעקוב אחר מספר הניחושים שביצע המשתשמש.

- -
guessCount++;
- -
-

לתשומת לב: אופרטורים אלו נמצאים בדרך כלל בלולאות, עליהן נלמד בהמשך הקורס. לדוגמא, אם אנחנו רוצים לעבור על רשימה של מחירים, ולהוסיף מס על כל אחד מהם, אנחנו יכולים להשתמש בלולאה על מנת לעבור על כל ערך ברשימה, ולעשות את החישוב המתאים של הוספת מס. האופטרטור הוספה ישמש להעביר אותנו לערך הבא כשנצטרך. ראה לדוגמא כיצד זה מבוצע בדף האינטרנט וגם בקוד המקור. בדקו האם אתם מזהים את האופרטורים שמשמשים להוספה/הורדה בתוך הלולאה, נדון בהם בהמשך.

-
- -

ננסה לשחק קצת בקונסולה. על מנת להתחיל, שימו לב שאתם לא יכול החיל אותם ישר על מספר כלשהו, למרות שזה נראה מוזר, אבל בפועל, כשאנחנו מעלים את הערך, אנחנו לא מבצעים חישוב כלשהו, אלא אנחנו משימים את החדש, לאחר החישוב, בתוך המשתנה. הפעולה הבאה תחזיר לדוגמא שגיאה:

- -
3++;
- -

כלומר, אנחנו יכולים רק להעלות משתנה קיים ב-1. נסו להזין את הקוד הבא:

- -
let num1 = 4;
-num1++;
- -

משהו מוזר נוסף. כשאנחנו עושים זאת, הערך 4 מוחזר לנו בקונסולה. זה מכיוון שהדפדפן מחזיר את הערך הנוכחי ורק אז מעלה את הערך של המשתנה. ניתן לראות שהערך של המשתנה הועלה ב-1 אם נזין שוב את השם של המשתנה בקונסולה.

- -
num1;
- -

אותו הדבר לגבי --  נסו את הקוד הבא:

- -
let num2 = 6;
-num2--;
-num2;
- -
-

לתשומת לב: אנו יכולים לגרום לדפדפן לבצע זאת בצורה אחרת - כלומר, להעלות את המשתנה ב-1 ורק אז להחזיר לנו את הערך החדש של המשתנה באמצעות הוספת האופרטור לפני המשתנה ולא בסופו. נסו להזין את הקוד הבא ++num1 ואז --num2.

-
- -

Assignment operators - אופרטורים להשמה

- -

אופרטורים להשמה אלו אופרטים שמשימים ערך לתוך משתנה. ראינו זאת עם הבסיסי שבה: =- הוא פשוט משים את הערך מצד שמאל, למשתנה שמצויין מצד ימין.

- -
let x = 3; // x contains the value 3
-let y = 4; // y contains the value 4
-x = y; // x now contains the same value y contains, 4
- -

אך יש כאלה מורכבים יותר, שיכולים לתת לנו קיצורי דרך על מנת לרשום את הקוד שלנו נקי ויעיל יותר. הנפוצים הם:

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
אופרטורשםמטרהדגומאקיצור עבור
+=חיבור והשמהמוסיף את הערך מצד ימין לערך שבמשתנה מצד שמאל, ואז מחזיר את הערך של המשתנה החדשx = 3;
- x += 4;
x = 3;
- x = x + 4;
-=חיסור והשמהמחסיר את הערך מצד ימין מתוך הערך שנמצא בתוך המשתנה מצד שמאל, ואז מחזיר את הערך של המשתנה החדשx = 6;
- x -= 3;
x = 6;
- x = x - 3;
*=כפל והשמהמכפיל את הערך מצד ימין עם הערך שנמצא במשתנה מצד שמאל, ואז מחזיר את הערך של המשתנה החדשx = 2;
- x *= 3;
x = 2;
- x = x * 3;
/=חילוק והשמהמחלק את הערך מצד ימין בערך שנמצא במשתנה מצד שמאל, ואז מחזיר את הערך של המשתנה החדשx = 10;
- x /= 5;
x = 10;
- x = x / 5;
- -

נסו להזין חלק מהדוגמאות הרשומות למעלה לתוך הקונסולה, על מנת להבין את הרעיון. בכל מקרה, נסו לראות אם אתם מצליחים לדעת מה הערך שיוחזר לפני החישוב וההשמה.

- -

כמובן שגם ניתן לבצע את החישובים וההשמות גם כאשר נמצאים משתנים משני צידי הסימן. לדוגמא:

- -
let x = 3; // x contains the value 3
-let y = 4; // y contains the value 4
-x *= y; // x now contains the value 12
- -
-

לתשומת לב: יש הרבה אופרטורים להשמה נוספים, אבל אלו הבסיסיים שאתם צריכים לדעת לעת עתה.

-
- -

למידה אקטיבית: שינוי גודל של canvas box

- -

בתרגיל זה נלמד כיצד לבצע מניפולציות על מספרים ואופרטורים, על מנת לשנות גודל של קופסא. הקופסא מצויירת באמצעות browser API אשר נקרא {{domxref("Canvas API", "", "", "true")}}. אין מה לדאוג לגבי איך הוא עובד, רק התרכזו בחישובים עצמם. הגובה והרוחב של הקופסא בפיקסלים יוגדרו על ידי המשתנים x ו- y, אשר קיבלו ערך התחלתי של 50.

- -

{{EmbedGHLiveSample("learning-area/javascript/introduction-to-js-1/maths/editable_canvas.html", '100%', 620)}}

- -

Open in new window

- -

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

- - - -

אל תדאגו אם אתם הורסים את הקוד לחלוטין. פשוט לחצו על הכפתור לאתחל את הכל.

- -

Comparison operators - אופרטורים להשוואה

- -

לפעמים נרצה לבצע מבחני אמת/שקר, ואז להריץ פעולות מסוימות בהתאם לתוצאת המבחן - בשביל זה נועדו אופרטורים להשוואה.

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
אופרטורשםמטרהדוגמא
===השוואה מוחלטתאופרטור זה בודק הא הערכים מצד ימין וצד שמאל זהים לחלוטין5 === 2 + 4
!==שונים לחלוטיןבודק האם הערך מצד ימיןלא זהה לערך מצד שמאל5 !== 2 + 3
<קטן מ-בודק האם הערך בצד שמאל קטן מהערך בצד ימין.10 < 6
>גדול מ-בודק האם הערך בצד שמאל גדול מהערך בצד ימין.10 > 20
<=קטן מ- או שווה ל-בודק האם הערך בצד שמאל קטן מהערך בצד ימין או שווה לו.3 <= 2
>=גדול מ- או שווה ל-בודק האם הערך בצד שמאל גדול מהערך בצד ימין או שווה לו.5 >= 4
- -
-

לתשומת לב: לפעמים תראו אנשים שמשתמשים באופרטור == או != במבחני בדיקת זהות/שונות שלהם. אלו אופרטורים תקינים לחלוטין בשפה, אבל הם שונים מ - ===/!==. הראשונים מבצעים בדיקה האם הערכים בצד ימין ובצד שמאל זהים מבחינת הערך עצמו, אך ״אדישים״ לגבי הזהות מבחינת סוג הערך. ואילו האחרונים מבצעים בדיקה של זהות/שונות מוחלטת - גם ערכים וגם סוג הערך. שימוש בבדיקת זהות/שונות מוחלטת נוטה להציג פחות שגיאות, אז המלצתנו היא להשתמש בהם.

-
- -

אם תנסו להכניס כמה מהערכים הללו לקונסולה את תראה בחזרה ערכי true/false - אלו ערכים בולאינים, כפי שהזכרנו במאמר קודם. ערכים אלו מאוד שימושיים מכיוון שהם מאפשרים לבצע החלטות בקוד שלנו, ואנחנו משתמשים בהם בכל פעם שאנרצה לקבל החלטה מסוג כלשהו. בוליאנים יכולים לשמש עבור:

- - - -

אנו נסתכל על דרך לכתוב קוד באמצעות שימוש בלוגיקה כשנלמד על משפטי תנאי במאמרים הבאים. לבינתיים, ראו דוגמא:

- -
<button>Start machine</button>
-<p>The machine is stopped.</p>
-
- -
const btn = document.querySelector('button');
-const txt = document.querySelector('p');
-
-btn.addEventListener('click', updateBtn);
-
-function updateBtn() {
-  if (btn.textContent === 'Start machine') {
-    btn.textContent = 'Stop machine';
-    txt.textContent = 'The machine has started!';
-  } else {
-    btn.textContent = 'Start machine';
-    txt.textContent = 'The machine is stopped.';
-  }
-}
- -

{{EmbedGHLiveSample("learning-area/javascript/introduction-to-js-1/maths/conditional.html", '100%', 100)}}

- -

פתח בחלון חדש

- -

אתם יכולים לראות את האופרטור להשוואה מתקיים בתוך פונקציית ()updateBtn . במקרה זה, אנחנו לא בודקים האם שני ביטויים מתמידים הם בעלי ערך זהה, אלא אנחנו בודקים האם תוכן הטקסט של הכפתור כולל בתוכו מחרוזת מסויימת - אבל עדיין מדובר באותו עקרון שלמדנו עליו. אם הכפתור כולל בתוכו מחרוזת "Start machine" כשלוחצים עליו, אזי נשנה את השם שלו בהתאם. אם הוא כולל מחרוזת "Stop machine" אזי נבצע החלפה שוב.

- -
-

לתשומת לב: אפשרות כזו להחליף בין שני מצבים נקראת toggle. הוא מחליף פשוט בין מצב אחד למצב שני.

-
- -

לסיכום

- -

במאמר זה כיסינו את הידע החשוב והכרחי שאתם צריכים לדעת על מספרים בשפה. לבינתיים. אתם תראו מספרים דיי הרבה פעמים, לכל אורך הלימוד, אז זה רעיון טוב שתתחילו להתרגל אליהם ולהבין אותם. אל תפחדו מהם.

- -

במאמר הבא נבין איך השפה מאפשרת לנו לבצע מניפולציות שונות על מחרוזות וטקסטים ויצד נוכל לבצע בהם שימוש.

- -
-

לתשומת לב: אם אתם מעוניינים להרחיב את הידיעות בנושא, ראו את הדפים שלנו בנושא  Numbers and dates ו-Expressions and operators.

-
- -

{{PreviousMenuNext("Learn/JavaScript/First_steps/Variables", "Learn/JavaScript/First_steps/Strings", "Learn/JavaScript/First_steps")}}

- -

במודול זה

- - -- cgit v1.2.3-54-g00ecf