interface בסגנון מונחה עצמים ב-TypeScript

interface מחייב כל קוד שמיישם אותו לכתוב מתודות או שדות מסוימים.

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

אפשר להמשיך לנסות להסביר את זה, אבל אני מעדיף להדגים באמצעות קוד.

interface Car {
    model: string;
    year: number;
    color?: string; // שדה אופציונלי
}

ועכשיו כל אובייקט או מחלקה שתיישם את ה-interface ששמו Car יהיו חייבים להכיל את השדות model ו-year, אבל לא את השדה color, כיוון שהוא אופציונלי (כפי שמעיד סימן השאלה שמופיע מימין לשדה).

נאמר שהמשתנה subaru מיישם את ה-interface.

let subaru: Car;

subaru = {model: 'DL', year: 1989};

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

subaru= {model: 'DL', year: 1989, color: 'beige'};

גם קוד זה יקומפל בהצלחה כי הוא מכיל את שני שדות החובה וגם את הפרמטר האופציונלי.

subaru= {model: 'DL', year: 1989, color: 'beige', driver: 'Moshe'};

הקומפילציה של הקוד תזרוק שגיאה, בגלל שהוספנו שדה שלא קיים ב-interface (driver).

subaru = {model: 'DL'};

קוד זה יגרום לשגיאת קומפילציה כי השדה year החיוני ליישום ה-interface חסר.

כפי ש-interface יכול לחייב אובייקט להכיל שדות מסוימים, הוא יכול לחייב מחלקה ליישם שדות ומתודות מסוימים.

לדוגמה, כל מחלקה שתיישם את ה-interface תהיה חייבת ליישם את השדה speed וגם את המתודה accelerate (שמקבלת פרמטר מסוג מספרי, ומחזירה שום דבר, void).

// Inteface
interface Car {
    speed: number;
    accelerate(by: number): void;
}

// Class to implement the interface
let car: Car = {
     speed: 80,
     accelerate: function(by: number): void{
         this.speed += by;
    }
}

מה יקרה כשנקמפל את הקוד ל-JavaScrip

קומפילציה של הקוד ל-JavaScript תגרום להעלמות ה-interface, וזה בגלל שאין ב-JavaScript שום דבר שמקביל ל-interface שמציע TypeScript.

כך יראה הקוד המקומפל:

// האינטרפייס נעלם בקומפילציה
var car = {
    speed: 80,
    accelerate: function (by) {
        this.speed += by;
    }
};

אם כן מה הטעם להשתמש ב-interface?

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

במדריך הבא, נטפל בעוד טכניקה מועילה של TypeScript שהיא השימוש ב-generics.

לכל מדריכי ה-TypeScript

אהבתם? לא אהבתם? דרגו!

0 הצבעות, ממוצע 0 מתוך 5 כוכבים