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

מאמר זה מסביר על טיפול שגיאות ב-TypeScript.

YouTube Video

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

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

תחביר try...catch

התחביר הבסיסי לטיפול בשגיאות הוא כדלהלן:.

 1try {
 2    // Code that may throw an error
 3    throw new Error("Something went wrong!");
 4} catch (error) {
 5    // Catch and handle the error
 6    console.error("Error:", error);
 7} finally {
 8    // Code that runs regardless of whether an error occurred
 9    console.log("Finally block executed.");
10}

טיפול שגיאות בטיחותי מבחינת טיפוסים

ב-TypeScript, שגיאות הנתפסות בבלוק catch נחשבות כברירת מחדל לטיפוס any, אך מומלץ להגדיר את הטיפוס המתאים לטיפול שגיאות בטוח יותר. לדוגמה, ניתן להגדיר ולהשתמש בטיפוס שגיאה מותאם אישי באופן הבא:.

 1class CustomError extends Error {
 2    constructor(message: string, public errorCode: number) {
 3        super(message);
 4        this.name = "CustomError";
 5    }
 6}
 7
 8try {
 9    throw new CustomError("Invalid operation", 400);
10} catch (error) {
11    if (error instanceof CustomError) {
12        console.error(`Error: ${error.message}, Code: ${error.errorCode}`);
13    } else {
14        console.error("Unknown error occurred");
15    }
16}

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

טיפול שגיאות אסינכרוני

ב-TypeScript עושים שימוש גם ב-try...catch כדי לטפל בשגיאות בשימוש בפונקציות אסינכרוניות.

 1async function fetchData() {
 2    try {
 3        const response = await fetch("https://api.example.com/data");
 4        if (!response.ok) {
 5            throw new Error(`HTTP error! status: ${response.status}`);
 6        }
 7        const data = await response.json();
 8        console.log(data);
 9    } catch (error) {
10        console.error("Failed to fetch data:", error);
11    }
12}
13
14fetchData();

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

סיכום

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

שגיאה

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

יסודות מחלקת Error

מחלקת Error משמשת באופן הבא.

1const error = new Error("Something went wrong!");
2console.log(error.message); // "Something went wrong!"
3console.log(error.name);    // "Error"

תכונות

למחלקה Error קיימים המאפיינים הבאים:.

• message מחרוזת שמציגה את הודעת השגיאה.
• name שם השגיאה. ברירת המחדל היא "Error", אך ניתן לשנות זאת על ידי יצירת מחלקת שגיאה מותאמת אישית.
• stack מידע על עקבות מחסנית (stack trace) המשמש לניפוי שגיאות. מחרוזת שמציינת איזה קוד גרם לשגיאה בזמן שזו התרחשה.

מחלקת שגיאה מותאמת אישית

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

דוגמה ליצירת שגיאה מותאמת אישית

 1class CustomError extends Error {
 2    constructor(message: string, public errorCode: number) {
 3        super(message); // Call the constructor of the parent class 'Error'
 4        this.name = "CustomError"; // Set the name of the error
 5    }
 6}
 7
 8const customError = new CustomError("Invalid operation", 400);
 9console.log(customError.message);   // "Invalid operation"
10console.log(customError.name);      // "CustomError"
11console.log(customError.errorCode); // 400

• על ידי יצירת מחלקת CustomError והוספת מידע כגון קודי שגיאה, ניתן לנהל מידע מקיף יותר על השגיאות.

ירושת מחלקת Error

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

1. קריאה ל-super() בקונסטרקטור של מחלקת שגיאה מותאמת אישית, חובה לקרוא ל-super() כדי להפעיל את הקונסטרקטור של מחלקת Error. זה מבטיח שפרמטרי message ו- stack יאותחלו בצורה נכונה.

2. הוספת מאפיינים אם ברצונך להוסיף מידע נוסף לאובייקט השגיאה, הגדר מאפיינים חדשים בתוך המחלקה. לדוגמה, ב- CustomError לעיל, נוסף מאפיין errorCode.

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

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

 1function riskyOperation() {
 2    throw new Error("Something went wrong during the operation");
 3}
 4
 5try {
 6    riskyOperation();
 7} catch (error) {
 8    if (error instanceof Error) {
 9        console.error(error.message);  // "Something went wrong during the operation"
10        console.error(error.name);     // "Error"
11    }
12}

גם במקרה של שגיאות מותאמות אישית, יש להשתמש ב- instanceof כדי לזהות שגיאות ספציפיות ולטפל בהן בהתאם.

 1class CustomError extends Error {
 2    constructor(message: string, public errorCode: number) {
 3        super(message);
 4        this.name = "CustomError";
 5    }
 6}
 7
 8try {
 9    throw new CustomError("Database connection failed", 500);
10} catch (error) {
11    if (error instanceof CustomError) {
12        console.error(`Error: ${error.message}, Code: ${error.errorCode}`);
13    }
14}

סיכום

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

תוכלו לעקוב אחר המאמר שלמעלה באמצעות Visual Studio Code בערוץ היוטיוב שלנו. נא לבדוק גם את ערוץ היוטיוב.

YouTube Video