TypeScript 中的泛型是什么？

在本文中，我们将尝试了解所有事实以及与 TypeScript 中的泛型相关的细节以及一些编码示例。

TypeScript 中的泛型：

• 每当编写或执行任何程序或代码时，人们总是要关心的一件主要事情就是制作可重用的组件，这进一步确保了程序或代码的可伸缩性和灵活性。
• 泛型，因此出现在这里，因为它为用户提供了灵活编写任何特定数据类型（或返回类型）的代码，并且调用该用户的时间可以具体传递数据类型或返回类型。
• 泛型提供了一种方法，使组件在为一定数量的参数（或实参）调用它时使用任何数据类型（或返回类型）。
• 在泛型中，我们传递一个称为类型参数的参数，它放在小号 ( < ) 和大号 ( > ) 之间，例如，它应该类似于。

编写泛型的语法：

我们可以使用以下语法将泛型添加到我们预先编写的代码中（这是在函数中使用泛型的语法）：

function function_name  
    (parameter_name : data_type_parameter) 
    : return_type_parameter {
        // Rest code......
    }

在 TypeScript 中使用泛型的优点：

以下是 TypeScript 中泛型提供的优势列表：

• 通过使用泛型，我们可以安全地存储单一类型的对象，而无需存储其他类型。
• 通过使用泛型，我们不需要在调用时实现任何变量或函数的类型转换。
• 泛型通常在编译时检查，因此在运行时不存在问题。

现在，在了解了与泛型相关的所有上述细节之后，让我们继续前进并查看以下一些代码示例，以更好地理解泛型 -

示例 1：在这个示例中，我们将简单地了解如何尝试创建一个包含泛型参数的泛型函数，以及如何使用泛型参数调用该泛型函数。

Javascript

function displayData  
    (parameter :type_parameter) : type_parameter{
      return parameter;
  }
  
let result1 = displayData  ("GeeksforGeeks");
let result2 = displayData  ("Hello World !!");
let result3 = displayData  (1234567890);
  
console.log(result1);
console.log(result2);
console.log(result3);

输出：

GeeksforGeeks
Hello World !!
1234567890

示例 2：在此示例中，我们可能会尝试创建一个泛型函数，其泛型返回类型为数组以及传入的泛型参数（也是泛型数组数据类型），以及我们如何调用该泛型函数，这将返回数组作为结果。

Javascript

let displayResult =  
    (data_item : type_parameter[]) : type_parameter[] => {
    return new Array ().concat(data_item);
  }
  
let numbersArray = displayResult
    ([50 , 60 , 80 , 90]);
      
let stringArray = displayResult
    (["Hello World", "GeeksforGeeks"]);
  
console.log(numbersArray);
console.log(stringArray);
  
numbersArray.push(100);
stringArray.push("Apple");
  
console.log(numbersArray);
console.log(stringArray);

输出：

[ 50, 60, 80, 90 ]
[ 'Hello World', 'GeeksforGeeks' ]
[ 50, 60, 80, 90, 100 ]
[ 'Hello World', 'GeeksforGeeks', 'Apple' ]

示例 3：在此示例中，我们将创建一些多泛型变量，并将进一步了解如何在我们为执行而制作的函数中调用它们。

Javascript

let displayResult =  
    (id : type_1, name : type_2) => {
      return id + " - " + name;
    }
  
let data_1 = displayResult(2000, "GeeksforGeeks");
      
let data_2 = displayResult(2001, "Hello World !!");
  
console.log(data_1);
console.log(data_2);

输出：

2000 - GeeksforGeeks
2001 - Hello World !!

参考： https://www.typescriptlang.org/docs/handbook/2/generics.html