如何在 TypeScript 中呼叫特定類的的方法?


在本教程中,使用者將學習如何在 TypeScript 中呼叫特定類的的方法。類是面向物件程式設計的基本概念。簡單來說,它包含成員變數和方法,我們可以透過建立該特定類的物件來訪問它們。因此,類是我們為該特定類建立的物件的藍圖。

類可以在 TypeScript 中包含函式,我們也可以稱它們為方法。因此,使用者需要學習如何訪問和呼叫特定類的的方法。

在 TypeScript 中呼叫特定類的的方法

在 TypeScript 中,我們可以建立特定類的物件例項。使用者可以使用點運算子透過以該類的物件為參考來訪問特定類的公共成員和方法。

語法

使用者可以按照以下語法學習如何建立類的物件,並使用物件和點運算子訪問該類的的方法。

// Creating the class
class Getsum {
   doSum(multiplier: number): number {
	   // perform some operation
      return value;
   }
}
var object: Getsum = new Getsum();
let result = object.doSum(10);

在上面的語法中,我們只是建立了包含方法的類。此外,我們還定義了類的物件例項,並使用點運算子訪問了 doSum() 方法。

示例

在下面的示例中,我們建立了 'GetSum' 類。我們還定義了型別為數字的 num1 和 num2 作為類成員,並分別用 10 和 20 值初始化它們。

接下來,我們定義了 doSum() 方法,該方法將 'multiplier' 作為引數並返回數字值。在方法內部,我們使用 'this' 關鍵字訪問 num1 和 num2,並將兩者都乘以 multiplier。之後,我們對 num1 和 num2 的新值進行求和,將其儲存在 'sum' 變數中並返回它。

// Creating the class
class Getsum {
   // defining the member variables of the class
   num1: number = 10;
   num2: number = 20;
   //   Method to get sum of two numbers
   doSum(multiplier: number): number {
      // Multiply num1 and num2 by multiplier
      this.num1 = this.num1 * multiplier;
      this.num2 = this.num2 * multiplier;
      // do sum of new num1 and num2, which we got after multiplying with the multiplier
      let sum = this.num1 + this.num2;
      return sum;
   }
}

// Creating the object of the Getsum class
var object: Getsum = new Getsum();
// calling the doSum() method
let result = object.doSum(10);
console.log("Result we get after calling the doSum method is " + result);

編譯後,它將生成以下 JavaScript 程式碼:

// Creating the class
var Getsum = /** @class */ (function () {
   function Getsum() {
      // defining the member variables of the class
      this.num1 = 10;
      this.num2 = 20;
   }
   // Method to get sum of two numbers
   Getsum.prototype.doSum = function (multiplier) {
      // Multiply num1 and num2 by multiplier
      this.num1 = this.num1 * multiplier;
      this.num2 = this.num2 * multiplier;
      // do sum of new num1 and num2, which we got after multiplying with the multiplier
      var sum = this.num1 + this.num2;
      return sum;
   };
   return Getsum;
}());
// Creating the object of the Getsum class
var object = new Getsum();
// calling the doSum() method
var result = object.doSum(10);
console.log("Result we get after calling the doSum method is " + result);

輸出

以上程式碼將產生以下輸出:

Result we get after calling the doSum method is 300

從一個類呼叫另一個類的的方法

在 TypeScript 中,我們可以訪問一個類的公共方法到另一個類,並可以呼叫它。有時,需要將其他類的少量方法呼叫到特定類。

語法

使用者可以按照以下語法從一個類呼叫另一個類的的方法。

class Getsum {
   doSum(): number {
      // perform some operation
   }
}

class Multiplier {
   object: Getsum = new Getsum();
   result = this.object.doSum();
   multiply(): number {
      // Perform some operation
   }
}
let multiplierObject: Multiplier = new Multiplier();
let result =  multiplierObject.multiply()

在上面的語法中,我們建立了兩個不同的類。我們已經將第一個類的的方法呼叫到第二個類,並在第二個類的另一個方法中使用了它的返回值。

示例

在下面的示例中,GetSum 類包含 doSum() 方法作為成員,該方法返回數字值。在 Multiplier 類中,我們建立了 GetSum 類的物件並透過以物件為參考呼叫了 GetSum 類的 doSum() 方法,並將它的返回值儲存在 result 中。

此外,我們在 Multiplier 類中建立了 multiply 方法,該方法將 result 乘以 30 並返回乘積值。最後,我們建立了 Multiplier 類的物件並透過以它為參考呼叫了 multiply 方法。

// Creating the class
class Getsum {
   // defining the member variables of the class
   num1: number = 145;
   num2: number = 243;
   //   Method to get sum of two numbers
   doSum(): number {
      let sum = this.num1 + this.num2;
      return sum;
   }
}

class Multiplier {
   // Creating the object of the Getsum class
   object: Getsum = new Getsum();
   // calling the doSum() method of the GetSum class inside the Multiplier class
   result = this.object.doSum();
   //  Method to multiply number
   multiply(): number {
      return this.result * 30;
   }
}
// Creating the object of the Multiplier class
let multiplierObject: Multiplier = new Multiplier();
// Invoking the multiply method of multiplier class
console.log(
   "Result we get after calling the multiply method is " +
   multiplierObject.multiply()
);

編譯後,它將生成以下 JavaScript 程式碼:

// Creating the class
var Getsum = /** @class */ (function () {
   function Getsum() {
      // defining the member variables of the class
      this.num1 = 145;
      this.num2 = 243;
   }
   //   Method to get sum of two numbers
   Getsum.prototype.doSum = function () {
      var sum = this.num1 + this.num2;
      return sum;
   };
   return Getsum;
}());
var Multiplier = /** @class */ (function () {
   function Multiplier() {
      // Creating the object of the Getsum class
      this.object = new Getsum();
      // calling the doSum() method of the GetSum class inside the Multiplier class
      this.result = this.object.doSum();
   }
   //  Method to multiply number
   Multiplier.prototype.multiply = function () {
      return this.result * 30;
   };
   return Multiplier;
}());
// Creating the object of the Multiplier class
var multiplierObject = new Multiplier();
// Invoking the multiply method of multiplier class
console.log("Result we get after calling the multiply method is " +
   multiplierObject.multiply());

輸出

以上程式碼將產生以下輸出:

Result we get after calling the multiply method is 11640

在 TypeScript 中呼叫特定類的靜態方法

我們可以直接訪問靜態方法,而無需獲取宣告該方法的類的物件的引用。我們需要在方法定義之前使用 static 關鍵字來定義靜態方法。

語法

使用者可以按照以下語法定義和呼叫靜態方法。

class demoClass {
   static printMessage(): void {
      // perform some operation
   }
}
demoClass.printMessage();

在上面的語法中,我們定義了包含靜態方法的類。此外,我們還透過以類名為參考來呼叫了靜態方法。

示例

在下面的示例中,我們建立了名為 demoClass 的類。我們透過在方法定義之前插入 static 關鍵字在類中定義了靜態方法,該方法列印訊息。

最後,我們使用 demoClass 作為參考並呼叫了 printMessage() 方法。

class demoClass {
   // add static keyword before method defination to make it static.
   static printMessage(): void {
      console.log(" Static method name printMessage is called.");
   }
}
// call the static method by taking class name as a reference
demoClass.printMessage();

編譯後,它將生成以下 JavaScript 程式碼:

var demoClass = /** @class */ (function () {
   function demoClass() {
   }
   // add static keyword before method defination to make it static.
   demoClass.printMessage = function () {
      console.log(" Static method name printMessage is called.");
   };
   return demoClass;
}());
// call the static method by taking class name as a reference
demoClass.printMessage();

輸出

以上程式碼將產生以下輸出:

Static method name printMessage is called.

使用者透過本教程學習瞭如何在 TypeScript 中呼叫類的的方法。此外,他們還學習瞭如何呼叫特定類的的靜態方法。此外,使用者還學習瞭如何將一個類的的方法呼叫到另一個類,這有助於他們重用程式碼。

更新於: 2022年12月16日

6K+ 瀏覽量

開啟你的 職業生涯

透過完成課程獲得認證

開始學習
廣告