解釋 TypeScript 中的箭頭函式語法

---

如果你使用過其他程式語言，比如 Python，你可能聽說過 lambda 函式。箭頭函式類似於 lambda 函式，它提供了一種更簡潔的方式來定義 TypeScript 中的函式。

我們可以透過使用胖箭頭並將其儲存在變數中來建立不帶“function”關鍵字的函式。之後，我們可以在需要時使用該變數來呼叫函式。

此外，箭頭函式沒有身份，因為它時匿名函式。因此，我們可以使用儲存它的變數來識別它。

語法

使用者可以按照以下語法在 TypeScript 中建立箭頭函式。

var variable = (param1: type, ...other params): return_type => {
   // code for the function
};

在上面的語法中，使用者可以看到我們將箭頭函式儲存在變數中，並使用胖箭頭來建立箭頭函式。此外，使用者還可以觀察我們如何向箭頭函式傳遞引數並定義其返回型別。

示例

在下面的示例中，我們建立了箭頭函式並將其儲存在 showMessage 變數中。我們在箭頭函式中列印了訊息以向用戶顯示。

// creating the anonymous arrow function
var showMessage = () => {
   console.log("Your welcome on the TutorialsPoint!");
};

// calling the arrow function.
showMessage();

編譯後，它將生成以下 JavaScript 程式碼：

// creating the anonymous arrow function
var showMessage = function () {
   console.log("Your welcome on the TutorialsPoint!");
};

// calling the arrow function.
showMessage();

示例

在這個示例中，我們將箭頭函式儲存在 mergeString 變數中。我們在箭頭函式中傳遞了三個字串型別的引數。在箭頭函式內部，我們將從引數中獲取的字串合併並打印出來。

我們透過使用 mergeString 變數並傳遞三個引數來呼叫箭頭函式。

// creating the anonymous arrow function
var mergeString = (str1: string, str2: string, str3: string) => {
   
   // merging the string
   let finalString: string = str1 + str2 + str3;
   console.log("The merged string is " + finalString);
};

// calling the arrow function.
mergeString("Hi", "Users", "!");

編譯後，它將生成以下 JavaScript 程式碼：

// creating the anonymous arrow function
var mergeString = function (str1, str2, str3) {
   
   // merging the string
   var finalString = str1 + str2 + str3;
   console.log("The merged string is " + finalString);
};

// calling the arrow function.
mergeString("Hi", "Users", "!");

示例

在這個示例中，我們還為箭頭函式定義了返回型別。箭頭函式接受兩個數字型別的引數，並在將引數相乘後返回數字值。

// defining the test arrow function

// param1 is of type number, and param2 is also of type number

// return type is the number
var test = (param1: number, param2: number): number => {
   console.log("The value of the param1 is " + param1);
   console.log("The value of the param2 is " + param2);
   return param1 * param2;
};

// calling the test function and printing its return value
let res: number = test(10, 20);
console.log("The value of the multiplication is " + res);

編譯後，它將生成以下 JavaScript 程式碼：

// defining the test arrow function

// param1 is of type number, and param2 is also of type number

// return type is the number
var test = function (param1, param2) {
   console.log("The value of the param1 is " + param1);
   console.log("The value of the param2 is " + param2);
   return param1 * param2;
};

// calling the test function and printing its return value
var res = test(10, 20);
console.log("The value of the multiplication is " + res);

示例

在下面的示例中，我們建立了 employee 類，其中包含 get_name() 屬性。我們使用箭頭函式初始化了 get_name() 屬性，該函式返回員工的姓名。

之後，我們建立了 employee 類的物件，並透過獲取物件作為引用來呼叫 get_namme() 方法。

class employee {
   
   // defining the get_name arrow function
   get_name = (): string => {
      let emp_name: string = "Shubham";
      return "The employee name is " + emp_name;
   };
}

// creating the object of the employee class
let emp_object = new employee();

// calling the get_name() function of employee class
console.log(emp_object.get_name());

編譯後，它將生成以下 JavaScript 程式碼：

var employee = /** @class */ (function () {
   function employee() {
      
      // defining the get_name arrow function
      this.get_name = function () {
         var emp_name = "Shubham";
         return "The employee name is " + emp_name;
      };
   }
   return employee;
}());

// creating the object of the employee class
var emp_object = new employee();

// calling the get_name() function of employee class
console.log(emp_object.get_name());

在本教程中，使用者學習瞭如何在 TypeScript 中使用箭頭函式以及示例。在本教程中，我們採用了包含引數和返回型別的不同箭頭函式示例。此外，我們還學習瞭如何使用箭頭語法來定義特定類的成員方法。