在开发实际的泛型类之前,我们先来了解一下generic类。称为泛型的 typescript 类可以处理多种类型的数据。它是各种参数,并使用尖括号 () 显示。这代表了该类将用于实现此目的的数据类型。然后可以在类的属性和函数中使用类型参数,以使类灵活并可与其他数据类型重用。
我们将做一些简报。假设在示例中,类型参数被表示为“t”并且简单泛型类“mygenericclass”的属性“value”被表示。 “t”和“价值”都可以被创造。如果此类使用替代类型(例如“数字”或“字符串”)实例化,则“值”属性将具有适当的类型。
由于同一个类可以与多种数据类型一起使用,这为您的代码提供了额外的灵活性和重用性。您还可以使用约束来限制用作类型参数的种类。
语法在 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());
输出上述代码将产生以下输出 -
112hellohelloworld
示例 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()) // ageconsole.log(numberkeyvaluepair.getvalue()) // 20let objectkeyvaluepair = new keyvaluepair<string, object>('person', { name: 'tutorialspoint', age: 10,})console.log(objectkeyvaluepair.getkey()) // personconsole.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()); // ageconsole.log(numberkeyvaluepair.getvalue()); // 20var objectkeyvaluepair = new keyvaluepair('person', { name: 'tutorialspoint', age: 10});console.log(objectkeyvaluepair.getkey()); // personconsole.log(objectkeyvaluepair.getvalue()); // {name: tutorialspoint, age: 10}
输出上述代码将产生以下输出 -
age20person{ name: 'tutorialspoint', age: 10 }
在 typescript 中使用泛型类可以生成更灵活、可重用且可维护的代码。此外,typescript 的类型检查系统可确保泛型类中使用的类型在编译时正确使用,从而进一步提高代码的整体质量和安全性。泛型类是 typescript 的一项强大功能,可用于编写更可靠和可重用的代码。
以上就是如何开发通用类的详细内容。