אינטרנט ישראל
  • ראשי
  • אודות רן בר-זיק ואינטרנט ישראל
  • ערוץ טלגרם
  • מסטודון
  • התחברו אלי בטוויטר
  • התחברו אלי בלינקדאין
  • ספר ג'אווהסקריפט
  • ראשי
  • אודות רן בר-זיק ואינטרנט ישראל
  • ערוץ טלגרם
  • מסטודון
  • התחברו אלי בטוויטר
  • התחברו אלי בלינקדאין
  • ספר ג'אווהסקריפט
ראשי » מדריכים » ES20XX » Logical Assignment Operator

Logical Assignment Operator

רן בר-זיק מרץ 21, 2021 7:07 am 11 תגובות

תוספת לתקן החדש בג'אווהסקריפט שעוזרת מאוד בהתמודדות עם השמות. במיוחד להגדרות ברירת מחדל

»ES2021 private methods
»מחלק ספרות
כדאי תמיד להשאר מעודכנים! אם יש לכם טלגרם, בדקו את ערוץ הטלגרם של האתר שבו אני מעדכן על פוסטים חדשים 🙂 אם אתם רוצים ללמוד תכנות באופן מקיף ומסודר, הצטרפו לאלפי הלומדים בפרויקט "ללמוד ג'אווהסקריפט בעברית" שמלמד לתכנת בג'אווהסקריפט, ב-Node.js ובריאקט וגם מלמד על תרומה לקוד פתוח. גם ספרים דיגיטליים וגם ספרים מודפסים. בשיתוף הקריה האקדמית אונו ובתמיכת חברות מובילות כגון Wix, Outbrain, Elementor, Iron Source, Chegg, Really Good ועוד.

אורח חדש ושימושי בתקן ES2021 – אני אפילו לא יודע איך לתרגם את זה – אופרטורים של השמה? בכל מקרה, זה קצת לא אינטואטיבי בהתחלה וחלק מכם יגידו "למה צריך את זה בכלל" – אבל בת'כלס זה שימושי וניסיתי להסביר למה. ומהרגע שזה נכנס ל-ES2021 נראה את זה יותר ויותר.

אז בואו ונתחיל. אנחנו מכירים את האופרטורים האלו, נכון?

&& – גם. למשל a && b זה גם a וגם b.
|| – או. למשל a || b זה או a או b.
?? – הכוכב החדש בשכונה (כן, שני סימני שאלה) עם השם Nullish Coalescing operator – שזה כמו || אבל גם לערכי false או null. הוא נכנס ב-ES2020.

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

let y = 5;
let x = 10;

if(x) {
  x = y
}

console.log(x); // 5

הוא די פשוט. אבל אני יכול לכתוב אותו באופן שונה. עם אופרטור לוגי:

let y = 5;
let x = 10;

x && (x = y);

console.log(x); // 5

מה זה אומר? קוד קצת לא אינטואטיבי. אני בעצם אומר יש x? אז יש גם x = y ומבצע את ההשמה. עכשיו בתקן החדש אני יכול לכתוב ככה:

let y = 5;
let x = 10;

x &&= y;

console.log(x); // 5

וזה האופרטור. אם יש x, אז תכניס לתוכו את הערך של y. הכי פשוט שיש. אם אין x? ההשמה לא תתבצע ו-x יישאר undefined.

האופרטור =&& שימושי מאוד אם אנו רוצים לדרוס משהו קיים.

אנו יכולים להשתמש באופרטור ||, וזה קצת יותר שימושי

let y = 5;
let x = false; // or undefined, or null

x ||= y;

console.log(x); // 5

במקרה הזה, אם x הוא undefined או false או null או אפס – תתבצע השמה.

כלומר האופרטור =|| שימושי אם אנו רוצים לבצע השמה רק אם משתנה מסוים הוא false – שימושי מאוד להגדרות.

אבל הכי שימושי הוא ידידנו ?? – כיוון שהוא מופעל אך ורק במקרה של undefined או null:

let y = 5;
let x; // undefined and null ONLY

x ??= y;

console.log(x); // 5

כלומר האופרטור =?? שימושי אם אנו רוצים לבצע השמה רק אם משתנה מסוים הוא undefined – שימושי ביותר להגדרות ברירת מחדל.

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

כדאי תמיד להשאר מעודכנים! אם יש לכם טלגרם, בדקו את ערוץ הטלגרם של האתר שבו אני מעדכן על פוסטים חדשים 🙂 אם אתם רוצים ללמוד תכנות באופן מקיף ומסודר, הצטרפו לאלפי הלומדים בפרויקט "ללמוד ג'אווהסקריפט בעברית" שמלמד לתכנת בג'אווהסקריפט, ב-Node.js ובריאקט וגם מלמד על תרומה לקוד פתוח. גם ספרים דיגיטליים וגם ספרים מודפסים. בשיתוף הקריה האקדמית אונו ובתמיכת חברות מובילות כגון Wix, Outbrain, Elementor, Iron Source, Chegg, Really Good ועוד.
es2021

11 תגובות

  1. פלוני אלמוני הגב מרץ 21, 2021 בשעה 9:12 am

    בהצגת האופרטור האחרון כתבת "אבל הכי שימושי הוא ידידנו &&", אני מאמין שהתכוונת ל-??.

  2. ינאי הגב מרץ 21, 2021 בשעה 9:15 am

    אבל הכי שימושי הוא ידידנו && – כיוון שהוא מופעל אך ורק במקרה של undefined:

    אמור להיות

    אבל הכי שימושי הוא ידידנו ?? – כיוון שהוא מופעל אך ורק במקרה של undefined:
    לא?

  3. גיא הגב מרץ 21, 2021 בשעה 9:23 am

    תודה על המאמר. ישנה טעות קטנה במשפט ײאבל הכי שימושי הוא ידידנו && – כיוון שהוא מופעל אך ורק במקרה של undefined:". התכוונת ל-?? אני מניח.

  4. יוסי הגב מרץ 21, 2021 בשעה 10:44 am

    "אבל הכי שימושי הוא ידידנו && "
    צריך לתקן ל- "??".
    ותודה על המאמר, כרגיל תמציתי וקולע!

  5. עידו הגב מרץ 21, 2021 בשעה 11:12 am

    יש typo קטן בסוף
    "אבל הכי שימושי הוא ידידינו &&" , נראה שהכוונה היא ל ??

  6. נוה הגב מרץ 21, 2021 בשעה 11:19 am

    כתבו פה רק 5 פעמים לגבי הטעות של ה&&, אז מי אני שלא אקח חלק במאמץ ואעיר על זה גם כן.. 😉

  7. יהודה הגב מרץ 21, 2021 בשעה 7:41 pm

    מותר להעיר על זה למרות שזה כבר תוקן? רוצה להרגיש חלק מהחבר'ה

  8. משתמש אנונימי (לא מזוהה) הגב מרץ 21, 2021 בשעה 11:42 pm

    כיף לראות שחזרת לכתוב על תכנות!

    רק רוצה להדגיש שכולם הם short-circuit, כלומר הערך בצד השני לא יוערך אם לא צריך (זה כמו האופרטורים הרגילים):
    "`js
    function get5() {
    console.log('gev5()');
    return 5;
    }
    let x = null;
    x ??= get5(); // Nothing is printed
    "`
    אבל לא פחות חשוב, גם ההשמה עצמה לא תתבצע אם לא צריך. זה חשוב עם setters:
    "`js
    const obj = {
    get x() { return 5; },
    set x() { console.log('set x()'); },
    };
    obj.x ??= 5; // Nothing is printed
    "`
    כלומר, `x ??= 5` לא מיתרגם ל`x = x ?? 5` אלא ל`x ?? (x = 5)` (או משפט if ארוך יותר).

  9. עודד הגב מרץ 24, 2021 בשעה 9:31 am

    שימושי מאוד.
    תודה רבה

  10. דניאל הגב מרץ 26, 2021 בשעה 8:19 pm

    הייתי מוסיף ששימוש הגיוני ל ?? זה עבור דיפולט למשתנה קונפיג כאשר המשתנה בוליאני:

    const { isProd } = userConfig
    const defaultIsProd = true

    isProd ??= defaultIsProd

    • משתמש אנונימי (לא מזוהה) הגב מרץ 28, 2021 בשעה 10:42 pm

      במקרה כזה עדיף להשתמש בdestructuring default value:

      const defaultIsProd = true;
      const { isProd = defaultIsProd } = userConfig;

השארת תגובה

ביטול

ללמוד ג'אווהסקריפט בעברית

ללמוד לתכנת ג'אווהסקריפט בעברית שגייס יותר משלוש מאות אלף שקל ולמעלה מ-2000 תומכים - בואו ללמוד עכשיו איך לתכנת.

רשימת הנושאים
  • מדריכים
    • ריאקט
    • טייפסקריפט
    • ECMAScript 6
    • ES20XX
    • Node.js
    • Express
    • רספברי פיי
    • Babel
    • docker
    • MongoDB
    • Git
    • לימוד MySQL
    • SASS
    • jQuery
    • CSS3
    • HTML 5
    • SVN
    • LESS
  • פיתוח אינטרנט
    • פתרונות ומאמרים על פיתוח אינטרנט
    • jQuery Scripts
    • jQuery למתקדמים
    • יסודות בתכנות
    • נגישות אינטרנט
  • חדשות אינטרנט
  • מידע כללי על אינטרנט
    • רשת האינטרנט
    • בניית אתרי אינטרנט
  • rss logo

    לכל המאמרים

    לכל המאמרים שפורסמו באינטרנט ישראל משנת 2008 ועד עכשיו.
  • rss logo

    RSS Feed

    משתמשים בקורא RSS? אם כן, עקבו אחרי אינטרנט ישראל באמצעות פיד ה-RSS!
    מה זה RSS?
  • Twitter logo

    עקבו אחרי בטוויטר

    בחשבון הטוויטר שלי אני מפרסם עדכונים מהירים על חדשות בתחום התכנות והיזמות, התרעות על מצבי חירום ורכילות בוערת על תחום הווב.
    מה זה טוויטר?
  • facebook like image

    ערוץ הטלגרם של אינטרנט ישראל

    בערוץ הטלגרם של אינטרנט ישראל אני מפרסם את הפוסטים של באתר וכן עדכונים טכנולוגיים נוספים.
    מה זה טלגרם?
  • github logo

    הפרויקטים שלי בגיטהאב

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

כל הזכויות שמורות לרן בר-זיק ולאינטרנט ישראל | מדיניות הפרטיות של אתר אינטרנט ישראל | אתר אינטרנט ישראל נגיש לפי תקן WCAG 2.0 AA | הצהרת הנגישות של האתר | אבטחת מידע ודיווח על בעיית אבטחת מידע

גלילה לראש העמוד