ממשקים גנריים
חלק מהיחידה מבוא ל-TypeScript במסלול ה-JavaScript של Coddy. שיעור 61 מתוך 73.
בדומה לכך שאפשר ליצור פונקציות גנריות, אפשר גם ליצור ממשקים גנריים. כך אפשר להגדיר את המבנה של אובייקט, ובו בזמן להשאיר סוגים של מאפיינים מסוימים גמישים וניתנים לשימוש חוזר.
כך יוצרים ממשק גנרי באמצעות אותו תחביר של פרמטרי טיפוס:
interface Container<T> {
value: T;
isEmpty: boolean;
}ה־<T> שמופיע אחרי שם הממשק יוצר פרמטר טיפוס שאפשר להשתמש בו בכל הגדרת הממשק. בדוגמה הזו, למאפיין value יהיה הטיפוס שתציין בעת השימוש בממשק, ואילו isEmpty יישאר מטיפוס boolean קבוע.
כשמשתמשים בממשק גנרי, מציינים את הסוג הקונקרטי בתוך סוגריים זוויתיים:
const stringContainer: Container<string> = {
value: "hello",
isEmpty: false
};
const numberContainer: Container<number> = {
value: 42,
isEmpty: false
};
אתגר
קלצרו ממשק גנרי בשם Result שיכול להכיל נתונים מכל סוג, יחד עם מידע על הצלחה.
לממשק צריכים להיות שני מאפיינים:
successמסוגbooleandataמסוגT(פרמטר הסוג הגנרי)
צרו את האובייקטים הבאים באמצעות הממשק הגנרי שלכם:
stringResultמסוגResult<string>עםsuccess: trueועםdata: "Operation completed"numberResultמסוגResult<number>עםsuccess: trueועםdata: 42booleanResultמסוגResult<boolean>עםsuccess: falseועםdata: falsearrayResultמסוגResult<string[]>עםsuccess: trueועםdata: ["item1", "item2", "item3"]
צרו פונקציה גנרית בשם processResult אשר:
- משתמשת בפרמטר סוג גנרי
T - מקבלת פרמטר אחד,
result, מסוגResult<T> - מחזירה הודעת מחרוזת
- אם
successהואtrue, מחזירה את"Success: [data]" - אם
successהואfalse, מחזירה את"Failed: [data]"
הדפיסו את הפלטים הבאים:
- הדפיסו את התוצאה של קריאה ל־
processResultעםstringResult - הדפיסו את התוצאה של קריאה ל־
processResultעםnumberResult - הדפיסו את התוצאה של קריאה ל־
processResultעםbooleanResult - הדפיסו את התוצאה של קריאה ל־
processResultעםarrayResult - הדפיסו את
stringResult.data
נסו בעצמכם
// TODO: כתבו את הקוד שלכם כאן
// צרו את הממשק הגנרי Result
// צרו את האובייקטים באמצעות הממשק Result
// צרו את הפונקציה הגנרית processResult
// הדפיסו את הפלטים הנדרשים
בחנו את עצמכםהשיעור הזה כולל חידון קצר. התחילו את השיעור כדי לענות עליו ולעקוב אחרי ההתקדמות.
כל השיעורים ביחידה מבוא ל-TypeScript
1תחילת העבודה עם TS
מה זה TypeScript?למה להשתמש ב-TypeScript?קוד TypeScript הראשון שלךתהליך הקומפילציה ושגיאותסיכום: מבוא ל-TS4עבודה עם פונקציות
הגדרת טיפוסים לפרמטרים ולערכי החזרההגדרת טיפוסים לפונקציות חץטיפוס ההחזרה 'void'פרמטרים אופציונליים עם '?'ערכי ברירת מחדל לפרמטריםהגדרת טיפוסים לפרמטרים מסוג Restהגדרת טיפוסי פונקציותסיכום: בניית פונקציות עם טיפוסים
2סוגי ליבה
טיפוסים בסיסיים: str, num, booleanהטיפוס 'any': מפלטהטיפוס 'unknown'עבודה עם 'null' ו-'undef'הסקת טיפוסים בפעולההצהרות טיפוסים מפורשותסיכום: תרגול בסוגי ליבה5טיפוסים: כינויים, איחודים וחיתוכים
כינויי טיפוס לטיפוסים פרימיטיבייםטיפוסי איחוד ('|')עבודה עם טיפוסי איחודטיפוסים מילולייםטיפוסי חיתוך ('&')שילוב כינויי טיפוסיםסיכום: שילובים מתקדמים של טיפוסים3מבני נתונים: מערכים וטאפלים
מערכים מטיפוסיםהמשנה 'readonly' למערכיםמהו טאפל?הכרזה על טאפל וגישה אליופירוק טאפלטאפלים לקריאה בלבדמערכים מטיפוסים רב־ממדייםאופרטור Spread עם מערכיםסיכום: מערכים וטאפלים6הגדרת טיפוסים לאובייקטים ולממשקים
הערות טיפוס מוטבעות לאובייקטיםכינויי טיפוס לאובייקטיםמבוא לממשקיםממשקים לעומת כינויי טיפוסמאפיינים אופציונליים וקריאה בלבדהרחבת ממשקים וטיפוסיםהוספת מתודות לממשקיםסיכום: הגדרת מבני אובייקטים9טיפוסים גנריים: מבט ראשון
הבעיה שטיפוסים גנריים פותריםיצירת פונקציית זהות גנריתשימוש בפונקציה גנריתמערכים גנרייםממשקים גנרייםסיכום: תרגול פונקציות גנריותתרגלו בעצמכם: TypeScript אונליין