אינטרנט ישראל
  • ראשי
  • אודות רן בר-זיק ואינטרנט ישראל
  • ערוץ טלגרם
  • מסטודון
  • התחברו אלי בטוויטר
  • התחברו אלי בלינקדאין
  • ספר ג'אווהסקריפט
  • ראשי
  • אודות רן בר-זיק ואינטרנט ישראל
  • ערוץ טלגרם
  • מסטודון
  • התחברו אלי בטוויטר
  • התחברו אלי בלינקדאין
  • ספר ג'אווהסקריפט
ראשי » מדריכים » ES20XX » ES2018 – יצירת finally ב-promise

ES2018 – יצירת finally ב-promise

רן בר-זיק יולי 22, 2018 7:07 am 8 תגובות

תוספת חשובה ל-promises שחשוב להכיר

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

אין לכם ולכן כמה מושג עד כמה התאפקתי כדי לא לכתוב בכותרת ״סוף סוף הפיצ׳ר שכולם חיכו לו״ או בדיחת אבא איומה בסגנון זה או אחר. אבל חסתי עליכם ועל עצמי. בכל מקרה, מדובר בפיצ׳ר מגניב וחשוב במיוחד ב-promises. מי שלא מבין מה זה promises – מדובר ב-הפיצ׳ר בה״א הידיעה. במאמר הבא על ES6 אני מסביר עליו בפירוט.

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


const myPromise = new Promise((resolve, reject) => {
  setTimeout(() => { resolve('success!!!'); }, 2000);
});

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


myPromise.then(
  result => { console.log(result) },
  failMessage => { console.log(failMessage) }
);

ב-then החביב יש לנו שתי פונקציות אנונימיות. הראשונה תעבוד במקרה של resolve והשניה במקרה של reject. כיוון שה-promise הזו תמיד מצליחה, אז תמיד נראה בקונסולה success. וזה נחמד. אבל אני יכול להוסיף עוד finally שתמיד יעבוד:


const myPromise = new Promise((resolve, reject) => {
  setTimeout(() => { resolve('success!!!'); }, 2000);
});

myPromise.then(
  result => { console.log(result) },
  failMessage => { console.log(failMessage) }
).finally(finallyMessage => { console.log('FINALLY!!')});

בלי שום קשר לתוצאות ה-promise, אני אראה צעקה finally בקונסולה. אין אמונה בגויים? שחקו עם זה כאן:

See the Pen promise finally example by Ran Bar-Zik (@barzik) on CodePen.

וזה.. זה מגניב 🙂 ושימושי, אפילו מאוד. למה? למשל אם יש לי אנימציה של ׳טעינה׳ שמתחילה ברגע שאני משגר את ה-promise, פה אני יכול לנקות אותה. אם יש לי איזה modal, זו יכולה להיות נקודה מצוינת לסגור אותו וכן הלאה. אם אני כותב ב-node, אז אני יכול לסגור connectionים. הקיצר, טוב להכיר.

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

8 תגובות

  1. Yanai הגב יולי 22, 2018 בשעה 12:31 pm

    What about try catch finely in native and in node? Can you write about them?

    • משתמש אנונימי (לא מזוהה) הגב יולי 22, 2018 בשעה 1:57 pm

      When using async await try catch is the equivalent of promise.then and promise.catch.
      promise.finally is the equivalent of try catch finally

      • Noam Gal הגב יולי 28, 2018 בשעה 1:27 pm

        exactly. While the feature is nice to whoever still has to use promises directly, using async/await code makes it a bit redundant, IMO.
        A simple try/catch/finally around the await makes the code simpler in all aspects.

  2. אמנון הגב יולי 22, 2018 בשעה 3:02 pm

    What's wrong with the following?

    .then(data => {console.log('success')})
    .catch(ex => {console.log('failure')})
    .then(() => {console.log('finally / always')})

    • Noam Gal הגב יולי 28, 2018 בשעה 1:26 pm

      The code you offered will never through the 'ex' outside to the calling code.

      • Noam Gal הגב יולי 28, 2018 בשעה 1:28 pm

        will never *throw* the 'ex' (sorry)

  3. תמיר הגב יולי 24, 2018 בשעה 1:42 am

    האם הsyntax החדש ES2018 נתמך בכל הפלטפורמות?

    • רמי יושובייב הגב אוגוסט 15, 2018 בשעה 1:03 pm

      ראה תמיכה בדפדפנים בקישור הבא:

      https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise/finally#Browser_compatibility

השארת תגובה

ביטול

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

ללמוד לתכנת ג'אווהסקריפט בעברית שגייס יותר משלוש מאות אלף שקל ולמעלה מ-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 | הצהרת הנגישות של האתר | אבטחת מידע ודיווח על בעיית אבטחת מידע

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