DanLevy.net

חידון: 9 שאלות Promise ב-JavaScript

לעולם אל תפר הבטחה שוב!

Hero image for חידון: 9 שאלות Promise ב-JavaScript

האם אתה מכיר את JavaScript Promises?

  • הוכיחו את כישורי ה-JavaScript שלכם! 🚀
  1. בדוק רמזים (כפתור גדול, בפינה התחתונה).
  2. נסה את הקוד בקונסול של הדפדפן (נסה קיצור דרך F12 או חפש אותו) או השתמש ב-repl.it*.
  3. אנא הרגש חופשי לצייץ אלי @justsml. אשמח לשמוע את מחשבותיך!

👇 השלם 9 שאלות למטה 👇

1. 

טיפול בשגיאות

מה יהיה הפלט עבור הקוד הבא?

var p = new Promise((resolve, reject) => {
  reject(Error('The Fails!'))
})
p.catch(error => console.log(error.message))
p.catch(error => console.log(error.message))

אנו יוצרים Promise באמצעות מתודת הבנאי, ומפעילים שגיאה מידית עם ה-callback reject.

לאחר מכן, מטפלי .catch פועלים כמו .addEventListener(event, callback) של ה-DOM או .on(event, callback) של Event Emitter, שבהם ניתן להוסיף מספר callbacks של מטפלים. כל אחד ייקרא עם אותם הארגומנטים.

2. 

טיפול בשגיאות

מה יהיה הפלט עבור הקוד הבא?

var p = new Promise((resolve, reject) => {
  return Promise.reject(Error('The Fails!'))
})
p.catch(error => console.log(error.message))
p.catch(error => console.log(error.message))

בעת שימוש בבנאי Promise עליך להפעיל את קריאות ה-resolve() או reject(). בנאי Promise מתעלם מערך ההחזרה של המבצע, כך שהבטחה הנוספת שנוצרה עם Promise.reject() אינה משורשרת ל-p. שני המטפלים מחוברים ל-p, שנשאר בהמתנה, בעוד שהבטחה הנדחת שהוחזרה מדווחת כלא מטופלת על ידי סביבת האירוח.

5. 

טיפול בשגיאות

מה יהיה הפלט עבור הקוד הבא?

new Promise((resolve, reject) => {
    resolve('Success!')
  })
  .then(() => {
    throw Error('Oh noes!')
  })
  .catch(error => {
    return "actually, that worked"
  })
  .catch(error => console.log(error.message))

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

6. 

טיפול בנתונים

מה יהיה הפלט של הקוד הבא?

Promise.resolve('Success!')
  .then(data => {
    return data.toUpperCase()
  })
  .then(data => {
    console.log(data)
  })

רמז: .then’s מעבירים נתונים ברצף, מ־return value אל ה־.then הבא (value => /* handle value */).

return הוא המפתח כדי להעביר ערך אל ה־.then הבא.

7. 

טיפול בנתונים

מה יהיה הפלט של הקוד הבא?

Promise.resolve('Success!')
  .then(data => {
    return data.toUpperCase()
  })
  .then(data => {
    console.log(data)
    return data
  })
  .then(console.log)

ישנן 2 קריאות console.log שייקראו.

8. 

טיפול בנתונים

מה יהיה הפלט עבור הקוד הבא?

Promise.resolve('Success!')
  .then(data => {
    data.toUpperCase()
  })
  .then(data => {
    console.log(data)
  })

רמז: .then’s מעבירים נתונים ברצף, מ-return value ל-.then(value => /* handle value */) הבא.

return הוא המפתח כדי להעביר ערך ל-.then הבא.

9. 

טיפול בנתונים

מה יהיה הפלט עבור הקוד הבא?

Promise.resolve('Success!')
  .then(() => {
    throw Error('Oh noes!')
  })
  .catch(error => {
    return 'actually, that worked'
  })
  .then(data => {
    throw Error('The fails!')
  })
  .catch(error => console.log(error.message))

ה־.catch הראשון מטפל בדחייה ומחזיר מחרוזת בלי להדפיס דבר. ה־.then הבא זורק Error('The fails!'), וה־.catch האחרון מדפיס רק את הודעת השגיאה הזו: The fails!.

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

Loading comments...