TypeScript學習筆記之五類(Class)
一、使用環境
- Mac 電腦
- WebStorm
- TypeScript3.x版本
二、類的基本介紹
如果您有其他面嚮物件語言的經驗,那麼(Class) 類 就是比較簡單的常用的型別,如果你沒有經驗,那麼我開始介紹TypeScript之前,先介紹一下概念方便您理解。
類(Class):定義了一件事物的抽象特點,包含它的屬性和方法
物件(Object):類的例項,通過 new 生成
物件導向(OOP)的三大特性:封裝、繼承、多型
封裝(Encapsulation):將對資料的操作細節隱藏起來,只暴露對外的介面。外界呼叫端不需要(也不可能)知道細節,就能通過對外提供的介面來訪問該物件,同時也保證了外界無法任意更改物件內部的資料
繼承(Inheritance):子類繼承父類,子類除了擁有父類的所有特性外,還有一些更具體的特性
多型(Polymorphism):由繼承而產生了相關的不同的類,對同一個方法可以有不同的響應。比如 Cat 和 Dog 都繼承自 Animal,但是分別實現了自己的 run 方法。此時針對某一個例項,我們無需瞭解它是 Cat 還是 Dog,就可以直接呼叫 run 方法,程式會自動判斷出來應該如何執行 run
存取器(getter & setter):用以改變屬性的讀取和賦值行為
抽象類(Abstract Class):抽象類是供其他類繼承的基類,抽象類不允許被例項化。抽象類中的抽象方法必須在子類中被實現
修飾符(Modifiers):修飾符是一些關鍵字,用於限定成員或型別的性質。比如 public 表示公有屬性或方法
介面(Interfaces):不同類之間公有的屬性或方法,可以抽象成一個介面。介面可以被類實現(implements)。一個類只能繼承自另一個類,但是可以實現多個介面
三、類的定義
使用 class 定義類,使用 constructor 定義建構函式。
類一般包括屬性 + 方法
class Greeter {
greeter : string; //類的屬性
constructor(message:string = "預設魔術"){
this.greeter = message;
}
//類的方法
greeting() {};
}
let grrent = new Greeter(); //通過 new 生成新例項的時候,會自動呼叫建構函式。
console.log(grrent);
四、類的三大特點(封裝、繼承、多型)
物件導向(OOP)的三大特性:封裝、繼承、多型
4.1、類的繼承
使用 extends 關鍵字實現繼承,子類中使用 super 關鍵字來呼叫父類的建構函式和方法
//動物類
class AnimalClass {
private name : string;
public constructor(theName:string){
this.name = theName;
};
public move(movedistance : number = 0){
console.log(`${this.name} 移動的距離是 ${movedistance}`);
};
}
//蛇繼承了動物類
class Shake extends AnimalClass{
constructor(name : string){
super(name); //初始化父類
};
move(movedistance:number =5){
console.log("Shake...");
super.move(movedistance);
}
}
//馬繼承了動物類
class House extends AnimalClass{
constructor(name : string){
super(name);
};
move(movedistance:number =10){
console.log("House...");
super.move(movedistance);
}
}
let shake = new Shake("蛇");
let house : AnimalClass = new House("馬");
shake.move(); // 多型
house.move(50); // 多型
五、類的存取器以及類的修飾符
使用 getter 和 setter 可以改變屬性的賦值和讀取行為
typeScript 可以使用三種訪問修飾符(Access Modifiers),分別是 public、private 和 protected。
public 修飾的屬性或方法是公有的,可以在任何地方被訪問到,預設所有的屬性和方法都是 public 的
private 修飾的屬性或方法是私有的,不能在宣告它的類的外部訪問
protected 修飾的屬性或方法是受保護的,它和 private 類似,區別是它在子類中也是允許被訪問的
class AnimalClass {
//只有當前類可以訪問
private _animalName : string;
public constructor(theName:string){
this._animalName = theName;
};
//子類可以訪問
protected move(movedistance : number = 0){
console.log(`${this._animalName} 移動的距離是 ${movedistance}`);
};
private jump(distance : number = 0){
console.log(`${this._animalName} jummp ${distance}`);
}
// getter setter存取器
set animalName(aName : string){
this._animalName = aName;
}
get animalName(){
return this._animalName;
}
}
六、靜態屬性和方法、例項方法和屬性
6.1、靜態方法、靜態屬性
使用 static 修飾符修飾的方法稱為靜態方法,它們不需要例項化,而是直接通過類來呼叫
class Animal {
//靜態屬性
static num = 42;
//靜態方法
static isAnimal(a) {
return a instanceof Animal;
}
}
let a = new Animal('Jack');
Animal.isAnimal(a); // true
a.isAnimal(a); // TypeError: a.isAnimal is not a function
console.log(Animal.num); // 42
6.3、例項方法和屬性
ES6 中例項的屬性只能通過建構函式中的 this.xxx 來定義,ES7 提案中可以直接在類裡面定義
class Animal {
//例項屬性
name = 'zibin';
constructor() {
// ...
}
}
//例項方法
run() {};
let a = new Animal();
console.log(a.name); // zibin
七、抽象類
抽象類做為其它派生類的基類使用。 它們一般不會直接被例項化。 不同於介面,抽象類可以包含成員的實現細節。 abstract關鍵字是用於定義抽象類和在抽象類內部定義抽象方法。
abstract class DefaultPersion {
//抽象方法
abstract makeSound():void;
move():void{
console.log('roaming the earch...');
}
}
類中抽取出介面
e.g門是一個類,防盜門是門的子類。如果防盜門有一個報警器的功能,我們可以簡單的給防盜門新增一個報警方法。
這時候如果有另一個類,車,也有報警器的功能,就可以考慮把報警器提取出來,作為一個介面,防盜門和車都去實現它
//介面1
interface IAlarm {
alert();
}
//介面2繼承與介面1
interface ILight extends IAlarm{
ligintOffOrOn();
}
//門類
class Door {
}
//安全門繼承門類遵守介面規定alert方法
class SecurityDoor extends Door implements IAlarm{
alert(){
console.log("安全們具有報警器....");
}
}
//車繼承門類遵守介面規定具有alert、ligintOffOrOn 方法
class Car implements IAlarm,ILight {
alert(){
console.log("汽車具有報警器....");
}
ligintOffOrOn(){
console.log('Car light off');
}
}
let c = new Car();
c.alert();
let s = new SecurityDoor();
s.alert();
如需瞭解更多知識
如需瞭解更多知識
TypeScript學習筆記之五類(Class)
TypeScript學習筆記之四介面(Inferfaces)
TypeScript學習筆記之三非原始資料型別
TypeScript學習筆記之二基本資料型別
TypeScript學習筆記之一初見TypeScript
相關文章
- typescript 學習筆記TypeScript筆記
- JVM學習筆記——Class類檔案解讀JVM筆記
- [學習筆記]TypeScript查缺補漏(一):類筆記TypeScript
- Typescript學習筆記(二)TypeScript筆記
- TypeScript class類相容TypeScript
- hive學習筆記之五:分桶Hive筆記
- 被迫開始學習Typescript —— classTypeScript
- TypeScript 之 Class(下)TypeScript
- TypeScript 之 Class(上)TypeScript
- js--class類、super和estends關鍵詞的學習筆記JS筆記
- ES6學習筆記(七)【class】筆記
- ES6學習筆記(八)【class】筆記
- ES6學習筆記(九)【class】筆記
- cmake學習筆記(五)筆記
- JVM 學習筆記(五)JVM筆記
- Java學習筆記-Day21 Java System類、Class類、內部類、異常處理Java筆記
- Python 學習筆記之類「物件導向,超類,抽象」Python筆記物件抽象
- Python機器學習筆記——One Class SVMPython機器學習筆記
- TypeScript學習(三)—— 類TypeScript
- Python 3 學習筆記之類與例項Python筆記
- Kubernetes學習筆記(五):卷筆記
- DP學習筆記(五)(2024.11.16)筆記
- c++學習筆記(五)C++筆記
- 字典--Python學習筆記(五)Python筆記
- TS學習筆記(三):類筆記
- Jenkinsant介紹(學習筆記五)Jenkins筆記
- Qt學習筆記(五)QString 字串QT筆記字串
- 抽象類特點 學習筆記抽象筆記
- java學習筆記(包裝類)Java筆記
- Netty學習筆記(五)NioEventLoop啟動Netty筆記OOP
- springcloud學習筆記(五)Spring Cloud ActuatorSpringGCCloud筆記
- TypeScript學習筆記—安裝與基礎型別TypeScript筆記型別
- TypeScript 學習筆記 — 函式中的型別(四)TypeScript筆記函式型別
- 學習筆記之測試筆記
- JS學習筆記之this指向JS筆記
- flask學習筆記之blueprintFlask筆記
- Swoft 學習筆記之配置筆記
- 學習筆記:DOM之appendChild筆記APP