TypeScript Generic Classes Explained

If tutorials available on this website are helpful for you, please whitelist this website in your ad blocker😭 or Donate to help us ❤️ pay for the web hosting to keep the website running.

Generics एक ऐसा concept है जो TypeScript को और flexible बनाता है। Generics का use कर के हम re-usability और type safety को improve कर सकते हैं, बिना code duplication के।

Generics का advantage यह होता है कि आप एक ही class, function, या interface को multiple types के साथ use कर सकते हैं।

इस topic में हम TypeScript Generic Classes को समझेंगे — यह कैसे काम करती हैं, इसका syntax क्या है, और real-world examples के through इसका implementation देखेंगे।

●●●

What are Generics ?

Generics का मतलब है एक ऐसी class, function, या interface बनाने कि capability जो अलग-अलग types के साथ काम कर सके।

मतलब, आप specific types के लिए code लिखने के बजाय generic code लिखते हो जो किसी भी type के साथ काम कर सकता है।

Key Points -

• Generics से आप reusable code लिख सकते हैं जो different types के लिए काम करे।

• TypeScript में Generics का use compile-time type safety के लिए होता है।

• Generics को T या किसी और placeholder type के through declare किया जाता है।

TypeScript , Simple Generic Example

Generics को TypeScript में angle brackets (< >) के अंदर define किया जाता है। आप एक placeholder type (जैसे T) को declare करते हैं जो specific types को represent करता है।

Copy
class ClassName<T> {
    value: T;

    constructor(value: T) {
        this.value = value;
    }

    getValue(): T {
        return this.value;
    }
}

इस example में, T एक generic type है जो class के अंदर use हो रहा है। जब आप इस class का object बनाएंगे, तब आप T को specific type के साथ replace करेंगे (जैसे string, number, etc.).

●●●

Real-World generic class example

समझो आपको एक Storage System banana है जिसमे अलग-अलग types के data को store कर सकें (जैसे strings, numbers, objects, etc.).

इसके लिए हम generics का use कर सकते हैं ताकि एक ही class को multiple types के साथ use किया जा सके।

Copy
// Generic class for Storage
class Storage<T> {
    private items: T[] = [];

    // Method to add items
    addItem(item: T): void {
        this.items.push(item);
    }

    // Method to remove items
    removeItem(item: T): void {
        this.items = this.items.filter(i => i !== item);
    }

    // Method to get all items
    getItems(): T[] {
        return this.items;
    }
}

// Using the generic class for string type
const stringStorage = new Storage<string>();
stringStorage.addItem("Apple");
stringStorage.addItem("Banana");
console.log(stringStorage.getItems());  // Output: ['Apple', 'Banana']
stringStorage.removeItem("Apple");
console.log(stringStorage.getItems());  // Output: ['Banana']

// Using the generic class for number type
const numberStorage = new Storage<number>();
numberStorage.addItem(10);
numberStorage.addItem(20);
console.log(numberStorage.getItems());  // Output: [10, 20]
numberStorage.removeItem(10);
console.log(numberStorage.getItems());  // Output: [20]

Explanation

• Storage<T> एक generic class है जो किसी भी type के item को store कर सकती है।

• हमने string और number types के लिए separate storage objects बनाये, लेकिन class एक ही है।

• Generics का use करके हमने code को ज़्यादा reusable और flexible बनाया।

●●●

TypeScript Bounded Generics

कभी-कभी हमें generics में restriction लगानी पड़ती है ताकि हम specific types के साथ ही काम करें। इस case में, हम bounded generics का use करते हैं।

इसमें आप generic types को specific constraints के साथ bind करते हैं।

TypeScript bounded generics example

समझो आपको एक class बनानी है जो numbers या objects जिनके पास numeric properties हो, उन्ही के साथ काम करे।

आप bounded generics का use कर सकते हैं extends keyword के through.

Copy
// Generic class with bounded type
class Calculator<T extends number | { value: number }> {
    add(a: T, b: T): number {
        if (typeof a === "number" && typeof b === "number") {
            return a + b;
        } else if (typeof a === "object" && typeof b === "object") {
            return a.value + b.value;
        }
        return 0;
    }
}

// Using the generic class with numbers
const numberCalc = new Calculator<number>();
console.log(numberCalc.add(10, 20));  // Output: 30

// Using the generic class with objects having numeric properties
const objectCalc = new Calculator<{ value: number }>();
console.log(objectCalc.add({ value: 5 }, { value: 10 }));  // Output: 15

Explanation

• Calculator<T extends number | { value: number }> एक bounded generic class है जो सिर्फ numbers या ऐसे objects के साथ काम कर सकती है जिनके पास value property हो।

• इसमें हमने add() method को implement किया जो numbers और objects दोनो को handle करता है।

• Generics को bound कर के हमने specific types पर restriction लगा दी , ताकि incorrect types का use न हो।

●●●

Advantages of Using Generic Classes

• Re-usability : Generics का use करके आप एक ही class को multiple types के लिए reuse कर सकते हैं, बिना same logic को बार-बार लिखने के।

• Type Safety : Generics से आप compile-time type checking का advantage ले सकते हैं, जो bugs को early stage पर detect करने में help करता है।

• Flexibility : Generics आपको अलग-अलग types के साथ काम करने कि flexibility देते हैं, बिना हर type के लिए अलग class बनाये।

• DRY (Don’t Repeat Yourself) Principle : Generics आपको DRY principle follow करने में help करते हैं, जिसमे आप repetitive code को avoid कर सकते हैं।

●●●

Conclusion

Generics TypeScript का एक important feature है जो आपके code को ज़्यादा flexible, reusable, और type-safe बनाता है।

Quick Recap -

• Generics का मतलब है ऐसे classes, functions, या interfaces बनाने कि capability जो multiple types के साथ काम कर सकती हैं।

• TypeScript में Generics का syntax angle brackets (<T>) का use कर के होता है।

• Real-world examples जैसे storage systems, API response wrappers, और key-value stores को generics के through implement कर सकते हैं।