Bagaimana untuk membangunkan kelas generik

Sebelum membangunkan kelas generik sebenar, mari kita fahami kelas Generik terlebih dahulu. Kelas TypeScript, dipanggil generik, boleh mengendalikan pelbagai jenis data. Ia ialah pelbagai parameter dan ditunjukkan menggunakan kurungan sudut (). Ini mewakili jenis data yang akan digunakan oleh kelas untuk mencapai tujuan ini. Parameter jenis kemudiannya boleh digunakan dalam sifat dan fungsi kelas untuk menjadikan kelas itu fleksibel dan boleh digunakan semula dengan jenis data lain.

Kami akan buat taklimat. Katakan dalam contoh, parameter jenis diwakili sebagai "T" dan atribut "nilai" kelas generik ringkas "MyGenericClass" diwakili. Kedua-dua "T" dan "nilai" boleh dibuat. Jika kelas ini digunakan menggunakan jenis alternatif (seperti "nombor" atau "rentetan"), sifat "nilai" akan mempunyai jenis yang sesuai.

Memandangkan kelas yang sama boleh digunakan dengan berbilang jenis data, ini memberikan fleksibiliti tambahan dan kebolehgunaan semula pada kod anda. Anda juga boleh menggunakan kekangan untuk mengehadkan jenis yang digunakan sebagai parameter jenis.

tatabahasa

Sintaks untuk mencipta kelas generik dalam TypeScript adalah seperti berikut -

class ClassName<TypeParameter> {
   // class properties and methods
}

Di mana "ClassName" ialah nama kelas dan "TypeParameter" ialah pemegang tempat untuk jenis data yang akan digunakan oleh kelas.

Contoh 1

Contoh ini menunjukkan cara menggunakan kelas generik dalam TypeScript untuk mencipta kelas yang boleh mengendalikan berbilang jenis data. Kelas ditakrifkan dengan parameter jenis T, yang digunakan dalam sifat dan kaedah kelas, membolehkan kelas menjadi fleksibel dan boleh digunakan semula dengan jenis data yang berbeza. Kelas "Barisan" mempunyai sifat peribadi yang dipanggil "data" yang merupakan tatasusunan jenis T.

Kelas ini juga mempunyai tiga kaedah: "enqueue", menambah item pada penghujung baris gilir; ke hadapan baris gilir tanpa memadamnya. Kami mencipta dua contoh kelas Baris, satu untuk nombor dan satu lagi untuk rentetan. Kelas ini boleh mengendalikan jenis data yang berbeza, menjadikan kod kami lebih fleksibel dan boleh digunakan semula.

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())

Apabila disusun, ia akan menjana kod JavaScript berikut.

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());

Output

Kod di atas akan menghasilkan output berikut -

1
1
2
Hello
Hello
world

Contoh 2

Dalam contoh ini, kami akan membangunkan satu lagi kelas generik dengan dua sifat jenis generik. Kelas "KeyValuePair" mempunyai dua sifat peribadi, "kunci" dan "nilai", masing-masing jenis T dan U. Kelas ini juga mempunyai dua kaedah "getKey" dan "getValue", yang masing-masing mengembalikan sifat kunci dan nilai.

Kelas ini boleh membuat instantiate kunci dan nilai menggunakan jenis data seperti nombor, rentetan atau objek. Kami mencipta dua contoh kelas KeyValuePair, satu dengan rentetan sebagai kunci dan nombor sebagai nilai, dan satu lagi dengan rentetan sebagai kunci dan objek sebagai nilai. Kelas ini boleh menggunakan jenis data yang berbeza sebagai kunci dan nilai, menjadikan kod kami lebih fleksibel dan boleh digunakan semula.

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}

Apabila disusun, ia akan menjana kod JavaScript berikut.

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}

Output

Kod di atas akan menghasilkan output berikut -

age
20
person
{ name: 'Tutorialspoint', age: 10 }

Menggunakan kelas generik dalam TypeScript menghasilkan kod yang lebih fleksibel, boleh digunakan semula dan boleh diselenggara. Selain itu, sistem semakan jenis TypeScript memastikan bahawa jenis yang digunakan dalam kelas generik digunakan dengan betul pada masa penyusunan, meningkatkan lagi kualiti dan keselamatan keseluruhan kod anda. Kelas generik ialah ciri hebat TypeScript yang boleh digunakan untuk menulis kod yang lebih dipercayai dan boleh digunakan semula.

Atas ialah kandungan terperinci Bagaimana untuk membangunkan kelas generik. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!