כיצד לעבוד עם TypeScript והבטחות

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

הבנת הבטחות

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

שימוש בסיסי בהבטחות

יצירה ושימוש בהבטחות ב-TypeScript היא פשוטה. הנה דוגמה להבטחה שנפתרת באמצעות מחרוזת:

function fetchData(): Promise {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve("Data fetched successfully!");
    }, 1000);
  });
}

fetchData().then((data) => {
  console.log(data); // Outputs: Data fetched successfully!
}).catch((error) => {
  console.error("Error:", error);
});

בדוגמה זו, fetchData מחזיר הבטחה שנפתרת עם מחרוזת. השיטה then מטפלת בערך שנפתר, בעוד ש-catch מטפל בכל שגיאה.

טיפול בהבטחות עם Async/Await

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

async function fetchDataAsync(): Promise {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve("Data fetched successfully!");
    }, 1000);
  });
}

async function processData() {
  try {
    const data = await fetchDataAsync();
    console.log(data); // Outputs: Data fetched successfully!
  } catch (error) {
    console.error("Error:", error);
  }
}

processData();

בדוגמה זו, הפונקציה fetchDataAsync מוכרזת כ-async, מה שמאפשר לה להשתמש במילת המפתח await כדי לחכות להבטחה. שגיאות נתפסות באמצעות בלוק try/catch.

הקלדת הבטחות עם גנריות

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

interface User {
  id: number;
  name: string;
}

function fetchUser(): Promise {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve({ id: 1, name: "John Doe" });
    }, 1000);
  });
}

fetchUser().then((user) => {
  console.log(user.id, user.name); // Outputs: 1 John Doe
}).catch((error) => {
  console.error("Error:", error);
});

בדוגמה זו, fetchUser מחזיר הבטחה שנפתרת עם אובייקט User. הסוג מוגדר באמצעות גנריות, מה שמבטיח בטיחות סוג.

שימוש בהבטחות ב-TypeScript עם קריאות API

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

async function getUserData(userId: number): Promise {
  const response = await fetch(`https://api.example.com/users/${userId}`);
  if (!response.ok) {
    throw new Error("Network response was not ok.");
  }
  const data: User = await response.json();
  return data;
}

getUserData(1).then((user) => {
  console.log(user);
}).catch((error) => {
  console.error("Error:", error);
});

דוגמה זו מדגימה כיצד להשתמש ב-fetch כדי לבצע קריאת API ולטפל בתגובה באמצעות הבטחות ו-async/wait. התגובה מוקלדת בתור User, מה שמבטיח בטיחות סוג.

מַסְקָנָה

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