ts---類

帅到要去报警發表於2024-08-28

ts是物件導向了 javascript，類描述了所建立的物件共同的屬性和方法。

例項：

class Car { 
   // 欄位
   engine:string;    
   // 建構函式
   constructor(engine:string) { 
      this.engine = engine 
   }     
   // 方法
   disp():void { 
      console.log("函式中顯示發動機型號  :   "+this.engine) 
   } 
} 
 
// 建立一個物件
var obj = new Car("XXSY1")
// 訪問欄位
console.log("讀取發動機型號 :  "+obj.engine)  
// 訪問方法
obj.disp()

類的繼承：extends 可以繼承一個已經存在的類，這個已存在的類稱為父類，繼承它的類稱為子類。

例項：

class Shape { 
   Area:number 
   
   constructor(a:number) { 
      this.Area = a 
   } 
} 
 
class Circle extends Shape { 
   disp():void { 
      console.log("圓的面積:  "+this.Area) 
   } 
}
  
var obj = new Circle(223); 
obj.disp()

需要注意的是子類只能繼承一個父類，TypeScript 不支援繼承多個類，但支援多重繼承，如下例項：

class Root { 
   str:string; 
} 
 
class Child extends Root {} 
class Leaf extends Child {} // 多重繼承，繼承了 Child 和 Root 類
 
var obj = new Leaf(); 
obj.str ="hello" 
console.log(obj.str)

繼承類的方法重寫：

類繼承後，子類可以對父類的方法重新定義，這個過程稱之為方法的重寫。

其中 super 關鍵字是對父類的直接引用，該關鍵字可以引用父類的屬性和方法。

class PrinterClass { 
   doPrint():void {
      console.log("父類的 doPrint() 方法。") 
   } 
} 
 
class StringPrinter extends PrinterClass { 
   doPrint():void { 
      super.doPrint() // 呼叫父類的函式
      console.log("子類的 doPrint()方法。")
   } 
}

靜態屬性和靜態方法：

class StaticMem {  
   static num:number; 
   
   static disp():void { 
      console.log("num 值為 "+ StaticMem.num) 
   } 
} 
 
StaticMem.num = 12     // 初始化靜態變數
StaticMem.disp()       // 呼叫靜態方法

instanceof 運算子
instanceof 運算子用於判斷物件是否是指定的型別，如果是返回 true，否則返回 false。

class Person{ } 
var obj = new Person() 
var isPerson = obj instanceof Person; 
console.log("obj 物件是 Person 類例項化來的嗎？ " + isPerson);

訪問控制修飾符

public（預設） : 公有，可以在任何地方被訪問。
protected : 受保護，可以被其自身以及其子類訪問。
private : 私有，只能被其定義所在的類訪問。

類和介面

類可以實現介面，使用關鍵字 implements，並將 interest 欄位作為類的屬性使用。

以下例項中 AgriLoan 類實現了 ILoan 介面：

interface ILoan { 
   interest:number 
} 
 
class AgriLoan implements ILoan { 
   interest:number 
   rebate:number 
   
   constructor(interest:number,rebate:number) { 
      this.interest = interest 
      this.rebate = rebate 
   } 
} 
 
var obj = new AgriLoan(10,1) 
console.log("利潤為 : "+obj.interest+"，抽成為 : "+obj.rebate )

打完收工！

相關文章