Класс ба TypeScript
JavaScript-д класс ES2015-с нэмэгдсэн. TypeScript нь классыг улам хүчирхэг болгож, property-д төрөл, constructor-д шалгалт, method-д гарын үсэг нэмдэг. Энэ хичээлд 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-т оноох алхмуудыг нэг мөрд багасгаж болно:
// Урт хувилбар
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)
Нэг классыг нөгөөгийнхөө суурь болгон ашиглах:
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-г унших эсвэл өөрчлөх үед нэмэлт логик ажиллуулах:
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-г заавал хэрэгжүүлэх болгох:
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 хандалтын түвшнүүд хэрхэн ажилладаг, яагаад хэрэглэдгийг нарийвчлан сурна.