Menguasai TypeScript Generics: Meningkatkan Kebolehgunaan Semula Kod dan Keselamatan Jenis

TypeScript telah merevolusikan cara kami menulis JavaScript, membawa penaipan statik dan alatan yang dipertingkatkan kepada proses pembangunan kami. Salah satu ciri yang paling berkuasa ialah generik, yang membolehkan kami mencipta komponen boleh guna semula yang berfungsi dengan pelbagai jenis. Dalam siaran ini, kami akan menyelami lebih mendalam mengenai generik TypeScript, meneroka cara mereka boleh meningkatkan fleksibiliti kod anda dan keselamatan menaip.

Memahami Generik

Generik menyediakan cara untuk mencipta komponen yang boleh berfungsi dalam pelbagai jenis dan bukannya satu. Ia amat berguna apabila anda ingin mencipta komponen yang boleh mengendalikan jenis data yang berbeza tanpa mengorbankan maklumat jenis.

Mari kita mulakan dengan contoh mudah:

function identity<T>(arg: T): T {
    return arg;
}

let output = identity<string>("myString");
console.log(output);  // Output: myString

Dalam contoh ini, T ialah pembolehubah jenis yang menangkap jenis yang disediakan oleh pengguna. Ini membolehkan kami menggunakan maklumat jenis itu kemudian.

Generik dalam Fungsi

Generik biasanya digunakan dalam fungsi untuk mencipta kod yang fleksibel dan boleh digunakan semula. Berikut ialah contoh yang lebih praktikal:

function firstElement<T>(arr: T[]): T | undefined {
    return arr[0];
}

let numbers = [1, 2, 3, 4, 5];
let strings = ["a", "b", "c"];

console.log(firstElement(numbers));  // Output: 1
console.log(firstElement(strings));  // Output: "a"

Fungsi ini berfungsi dengan sebarang jenis tatasusunan, mengembalikan elemen pertama jenis itu atau tidak ditentukan jika tatasusunan itu kosong.

Generik dalam Antara Muka

Generik juga boleh digunakan dalam antara muka untuk mencipta struktur data yang fleksibel:

interface KeyValuePair<K, V> {
    key: K;
    value: V;
}

let pair: KeyValuePair<string, number> = { key: "age", value: 30 };

Generik dalam Kelas

Kelas juga boleh memanfaatkan generik untuk mencipta komponen boleh guna semula:

class Queue<T> {
    private data: T[] = [];

    push(item: T) {
        this.data.push(item);
    }

    pop(): T | undefined {
        return this.data.shift();
    }
}

let numberQueue = new Queue<number>();
numberQueue.push(10);
numberQueue.push(20);
console.log(numberQueue.pop());  // Output: 10

Kelas Baris Gilir ini boleh berfungsi dengan sebarang jenis data, memberikan keselamatan jenis sepanjang penggunaannya.

Kekangan Generik

Kadangkala, kami ingin mengehadkan jenis yang boleh digunakan oleh generik. Kita boleh melakukan ini dengan kekangan:

interface Lengthwise {
    length: number;
}

function logLength<T extends Lengthwise>(arg: T): void {
    console.log(arg.length);
}

logLength("Hello");  // Works
logLength([1, 2, 3]);  // Works
logLength(3);  // Error: Number doesn't have a length property

Dalam contoh ini, kami mengekang T kepada jenis yang mempunyai sifat panjang.

Kesimpulan

Generik ialah ciri berkuasa dalam TypeScript yang membolehkan penggunaan semula kod dan keselamatan jenis yang lebih baik. Dengan menguasai generik, anda boleh menulis kod yang lebih fleksibel dan mantap yang berfungsi merentas pelbagai jenis. Sambil anda terus membangun dengan TypeScript, cari peluang untuk menggunakan generik untuk meningkatkan fleksibiliti dan kebolehselenggaraan kod anda.

Ingat, kunci untuk menguasai generik adalah amalan. Cuba pemfaktoran semula beberapa kod sedia ada anda untuk menggunakan generik dan anda akan melihat faedahnya dari segi kebolehgunaan semula kod dan keselamatan jenis.

Lagi tutorial skrip taip

Atas ialah kandungan terperinci Menguasai TypeScript Generics: Meningkatkan Kebolehgunaan Semula Kod dan Keselamatan Jenis. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!