如何开发泛型类
在开发实际的泛型类之前,让我们首先了解泛型类。泛型TypeScript类可以处理多种类型的数据。它是一种多参数类型,使用尖括号 (<>) 表示。这表示类将使用哪种类型的数据来实现这一点。然后可以在类的属性和函数中使用类型参数,使类更灵活,并可与其他数据类型重复使用。
我们将简要介绍一下。假设在一个例子中,类型参数表示为“T”,简单泛型类“MyGenericClass”的属性“value”。可以同时创建“T”和“value”。如果用不同的类型(例如“number”或“string”)实例化此类,“value”属性将具有相应的类型。
由于同一个类可以与多种数据类型一起使用,这使得您的代码更灵活,可重用性更高。您还可以使用约束来限制用作类型参数的类型。
语法
在 TypeScript 中创建泛型类的语法如下:
class ClassName<TypeParameter> { // class properties and methods }
其中“ClassName”是类的名称,“TypeParameter”是类将使用的类型数据的占位符。
示例 1
此示例演示如何在 TypeScript 中使用泛型类来创建一个可以处理多种数据类型的类。该类用类型参数 T 定义,该参数用于类的属性和方法中,允许该类灵活地与不同类型的数据重复使用。“Queue”类具有一个名为“data”的私有属性,这是一个 T 类型的数组。
该类还具有三个方法:“enqueue”,它将一个项目添加到队列的末尾;“dequeue”,它从队列的前面移除一个项目;以及“peek”,它返回队列前面端的项目而不将其移除。我们创建了 Queue 类的两个实例,一个用于数字,另一个用于字符串。该类可以处理不同类型的数据,使我们的代码更灵活,可重用性更高。
class Queue<T> { private data: T[] = [] // add an item to the end of the queue enqueue(item: T) { this.data.push(item) } // remove an item from the front of the queue dequeue(): T | undefined { return this.data.shift() } // get the item at the front of the queue peek(): T | undefined { return this.data[0] } } let numberQueue = new Queue<number>() numberQueue.enqueue(1) numberQueue.enqueue(2) console.log(numberQueue.peek()) console.log(numberQueue.dequeue()) console.log(numberQueue.peek()) let stringQueue = new Queue<string>() stringQueue.enqueue('Hello') stringQueue.enqueue('world') console.log(stringQueue.peek()) console.log(stringQueue.dequeue()) console.log(stringQueue.peek())
编译后,它将生成以下 JavaScript 代码。
var Queue = /** @class */ (function () { function Queue() { this.data = []; } // add an item to the end of the queue Queue.prototype.enqueue = function (item) { this.data.push(item); }; // remove an item from the front of the queue Queue.prototype.dequeue = function () { return this.data.shift(); }; // get the item at the front of the queue Queue.prototype.peek = function () { return this.data[0]; }; return Queue; }()); var numberQueue = new Queue(); numberQueue.enqueue(1); numberQueue.enqueue(2); console.log(numberQueue.peek()); console.log(numberQueue.dequeue()); console.log(numberQueue.peek()); var stringQueue = new Queue(); stringQueue.enqueue('Hello'); stringQueue.enqueue('world'); console.log(stringQueue.peek()); console.log(stringQueue.dequeue()); console.log(stringQueue.peek());
输出
以上代码将产生以下输出:
1 1 2 Hello Hello world
示例 2
在这个例子中,我们将开发另一个具有两种泛型类型属性的泛型类。“KeyValuePair”类有两个私有属性,“key”和“value”,分别为 T 和 U 类型。该类还有两个方法,“getKey”和“getValue”,分别返回键和值属性。
该类可以用数字、字符串或对象等数据类型来实例化键和值。我们创建了 KeyValuePair 类的两个实例,一个使用字符串作为键,数字作为值,另一个使用字符串作为键,对象作为值。该类可以处理键和值的不同数据类型,使我们的代码更灵活,可重用性更高。
class KeyValuePair<T, U> { private key: T private value: U constructor(key: T, value: U) { this.key = key this.value = value } // method to get the key getKey(): T { return this.key } // method to get the value getValue(): U { return this.value } } let numberKeyValuePair = new KeyValuePair<string, number>('age', 20) console.log(numberKeyValuePair.getKey()) // "age" console.log(numberKeyValuePair.getValue()) // 20 let objectKeyValuePair = new KeyValuePair<string, object>('person', { name: 'Tutorialspoint', age: 10, }) console.log(objectKeyValuePair.getKey()) // "person" console.log(objectKeyValuePair.getValue()) // {name: "Tutorialspoint", age: 10}
编译后,它将生成以下 JavaScript 代码。
var KeyValuePair = /** @class */ (function () { function KeyValuePair(key, value) { this.key = key; this.value = value; } // method to get the key KeyValuePair.prototype.getKey = function () { return this.key; }; // method to get the value KeyValuePair.prototype.getValue = function () { return this.value; }; return KeyValuePair; }()); var numberKeyValuePair = new KeyValuePair('age', 20); console.log(numberKeyValuePair.getKey()); // "age" console.log(numberKeyValuePair.getValue()); // 20 var objectKeyValuePair = new KeyValuePair('person', { name: 'Tutorialspoint', age: 10 }); console.log(objectKeyValuePair.getKey()); // "person" console.log(objectKeyValuePair.getValue()); // {name: "Tutorialspoint", age: 10}
输出
以上代码将产生以下输出:
age 20 person { name: 'Tutorialspoint', age: 10 }
在 TypeScript 中使用泛型类可以使代码更灵活、更可重用和更易于维护。此外,TypeScript 的类型检查系统确保在编译时正确使用泛型类中使用的类型,进一步提高了代码的整体质量和安全性。泛型类是 TypeScript 的一个强大功能,可以用来编写更可靠、更可重用的代码。