מחלקות ואובייקטים ב-TypeScript

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

מחלקות (class) ואובייקטים

נתחיל מכתיבת מחלקה פשוטה, Car.

class Car {
    sayHello(){
      return "Beep! Beep!";
   }
}

למחלקה Car יש מתודה אחת sayHello.

ניצור אובייקט מהמחלקה, ונקרא למתודה sayHello.

let myCar = new Car();
console.log(myCar.sayHello()); // Beep! Beep!

מילת המפתח this

מילת המפתח this מאפשרת לגשת לשדות ולמתודות בתוך האובייקט שבו היא נמצאת.

בדוגמה הבאה, השדה message מכיל את המחרוזת שתחזיר המתודה sayHello, והמתודה יכולה לגשת לשדה באמצעות this.

class Car {
    message: string;

    sayHello(){
      return this.message;
   }
}

// ניצור אובייקט מהמחלקה
let myCar = new Car();

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

myCar.message = "Howdy-doody!";
console.log(myCar.sayHello()); // Howdy-doody!

ודאי שמתם לב שהגדרנו את הערך של המשתנה message מחוץ למחלקה, וזה מפני שהמשתנה message הוא משתנה ציבורי (public).
במידה ונרצה למנוע גישה ישירה לשדה נצטרך לשנות את ההגדרה שלו לפרטי private או למוגן (protected).

משתנים פרטיים וכיצד לגשת אליהם

אנחנו יכולים למנוע את הגישה למשתנים מחוץ למחלקה על ידי הוספת הקידומת private.

class Car {
    private message: string;

    sayHello(){
      return this.message;
   }
}

במידה ונגדיר משתנה כפרטי, לא נוכל לגשת אליו מחוץ למחלקה, והדרך היחידה לגשת אליו היא באמצעות פונקציות ציבוריות מסוג setter ו-getter.

• פונקציות setter מאפשרות לקוד מחוץ למחלקה לשנות את ערכו של משתנה פרטי.
• פונקציות getter מאפשרות לקוד מחוץ למחלקה לקבל את ערכו של משתנה פרטי.

class Car {
    private message: string;

    sayHello(){
      return this.message;
   }

   setMessage(text: string){
       this.message = text || "Howdy-doody!";
  }
  
  getMessage(){
    return this.message;
  }
}

let myCar = new Car();

myCar.setMessage ("Beep! Beep!");

console.log(myCar.sayHello()); // Beep! Beep!

console.log(myCar.getMessage()); // Beep! Beep!

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

פונקציית בנאי (constructor)

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

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

class Car {  
  constructor(public model: string, public year: number) {}
}

let sussita = new Car("Carmel", 1979);
console.log(sussita.model, sussita.year);// Carmel, 1979

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

שדות ומתודות סטטיים

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

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

class Car {  
  static numberOfCars: number = 0;
  
  constructor(public model="", public year=0){
      Car.addOne();
  }
  
  static addOne(){
    Car.numberOfCars++;
  }

}

let sussita = new Car("Carmel", 1979);
let subaru = new Car("Subaru DL", 1989);

console.log(Car.numberOfCars); // 2

הורשה ב-TypeScript

ניתן ליצור מחלקה שיורשת ממחלקה אחרת את כל התכונות והמתודות. במצב זה, המחלקה היורשת:

• מקבלת את כל התכונות והמתודות של המחלקה שאותה היא יורשת.
• יכולה להוסיף תכונות ומתודות.
• יכולה לדרוס תכונות ומתודות שהיא ירשה.

נשתמש במילה השמורה extends כדי לציין ירושה.

בדוגמת הקוד להלן, המחלקה SportsCar יורשת את המחלקה Car, וגם המחלקה היורשת דורסת את הקונסטרקטור של המחלקה המקורית.

class SportsCar extends Car {
  // The constructor overrides the parent constructor
  constructor(public model="", public year=0){
    super(model, year); // Derived constructors must contain a super call
    SportsCar.addOne();
  }
}

ניצור אובייקט מהמחלקה:

let Ferrari = new SportsCar("Ferrari", 2017);
console.log(Car.numberOfCars);// אין בעיה להשתמש במתודה מההורה

האם האובייקט שייך למחלקה Car?

console.log(Ferrari instanceof Car);// true

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

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

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

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