TypeScript / Класс ба TypeScript

Класс ба TypeScript

JavaScript-д класс ES2015-с нэмэгдсэн. TypeScript нь классыг улам хүчирхэг болгож, property-д төрөл, constructor-д шалгалт, method-д гарын үсэг нэмдэг. Энэ хичээлд TypeScript дахь класс хэрхэн ажилладагыг сурна.

Энгийн класс

typescript
class Хүн {
  нэр: string;
  нас: number;

  constructor(нэр: string, нас: number) {
    this.нэр = нэр;
    this.нас = нас;
  }

  танилцуул(): string {
    return `Миний нэр ${this.нэр}, би ${this.нас} настай.`;
  }
}

const болд = new Хүн("Болд", 25);
console.log(болд.танилцуул()); // "Миний нэр Болд, би 25 настай."

TypeScript классын property-г заавал дээр нь зарлах шаардлагатай — JavaScript-ийн нэг ялгаа энэ. Хэрэв зарлаагүй бол Property does not exist алдаа гарна.

Constructor shorthand

Property зарлаж, constructor-т оноох алхмуудыг нэг мөрд багасгаж болно:

typescript
// Урт хувилбар
class Нохой {
  нэр: string;
  үүлдэр: string;

  constructor(нэр: string, үүлдэр: string) {
    this.нэр = нэр;
    this.үүлдэр = үүлдэр;
  }
}

// Constructor shorthand — parameter-т хандалтын түвшин нэмнэ
class Нохой {
  constructor(
    public нэр: string,
    public үүлдэр: string,
  ) {}
}

const нохой = new Нохой("Шарга", "Хаскай");
console.log(нохой.нэр); // "Шарга"
console.log(нохой.үүлдэр); // "Хаскай"

public гэсэн нэг үг нэмснээр TypeScript property-г автоматаар зарлаж, this-т оноодог. Кодыг хэд дахин богиносгоно.

Класс өвлөх (extends)

Нэг классыг нөгөөгийнхөө суурь болгон ашиглах:

typescript
class Амьтан {
  constructor(public нэр: string) {}

  ярих(): string {
    return `${this.нэр} ямар нэг дуу гаргана...`;
  }
}

class Муур extends Амьтан {
  constructor(
    нэр: string,
    public өнгө: string,
  ) {
    super(нэр); // Эцэг классын constructor-г дуудах
  }

  ярих(): string {
    return `${this.нэр} мяаана!`;
  }
}

class Нохой extends Амьтан {
  ярих(): string {
    return `${this.нэр} хуцана!`;
  }
}

const муур = new Муур("Майа", "цагаан");
const нохой = new Нохой("Шарга");

console.log(муур.ярих()); // "Майа мяаана!"
console.log(нохой.ярих()); // "Шарга хуцана!"

super() нь эцэг классын constructor-г дуудна. Хэрэв extends ашигласан классад constructor байвал super() заавал дуудах ёстой.

Getter ба Setter

Property-г унших эсвэл өөрчлөх үед нэмэлт логик ажиллуулах:

typescript
class Дугуй {
  private _радиус: number;

  constructor(радиус: number) {
    this._радиус = радиус;
  }

  // Getter — property шиг уншина
  get радиус(): number {
    return this._радиус;
  }

  // Setter — утга шалгаж оноох
  set радиус(утга: number) {
    if (утга <= 0) {
      throw new Error("Радиус 0-с их байх ёстой!");
    }
    this._радиус = утга;
  }

  get талбай(): number {
    return Math.PI * this._радиус ** 2;
  }
}

const дугуй = new Дугуй(5);
console.log(дугуй.радиус); // 5
console.log(дугуй.талбай); // 78.54...

дугуй.радиус = 10;
console.log(дугуй.талбай); // 314.16...

дугуй.радиус = -1; // Алдаа: "Радиус 0-с их байх ёстой!"

Interface хэрэгжүүлэх (implements)

Класс interface-г заавал хэрэгжүүлэх болгох:

typescript
interface Хэмжигдэхүүн {
  нэр: string;
  тооцоол(): number;
}

class Тэгш_өнцөгт implements Хэмжигдэхүүн {
  нэр = "Тэгш өнцөгт";

  constructor(
    private өргөн: number,
    private өндөр: number,
  ) {}

  тооцоол(): number {
    return this.өргөн * this.өндөр;
  }
}

class Гурвалжин implements Хэмжигдэхүүн {
  нэр = "Гурвалжин";

  constructor(
    private суурь: number,
    private өндөр: number,
  ) {}

  тооцоол(): number {
    return (this.суурь * this.өндөр) / 2;
  }
}

const дүрсүүд: Хэмжигдэхүүн[] = [new Тэгш_өнцөгт(4, 5), new Гурвалжин(6, 3)];

дүрсүүд.forEach((д) => console.log(`${д.нэр}: ${д.тооцоол()}`));
// "Тэгш өнцөгт: 20"
// "Гурвалжин: 9"

implements нь "энэ класс тэр interface-ийн бүх property, method-ыг агуулна" гэдгийг баталгаажуулдаг.

Дараагийн хичээлд:

public, private, protected хандалтын түвшнүүд хэрхэн ажилладаг, яагаад хэрэглэдгийг нарийвчлан сурна.