**Course Title:** Mastering TypeScript: From Basics to Advanced Applications **Section Title:** Advanced TypeScript Features **Topic:** Create a generic function or class that utilizes advanced TypeScript features.(Lab topic) **Introduction** In this lab, we will apply the advanced TypeScript features we have learned so far to create a generic function and class. We will use generics to create reusable components that work with multiple types, and map and conditional types to create more complex type transformations. By the end of this lab, you will be able to create your own generic functions and classes that utilize advanced TypeScript features. **Prerequisites** To complete this lab, you should have a good understanding of the following advanced TypeScript features: * Generics: reusable components with type parameters * Mapped types: transforming types with a map-like syntax * Conditional types: type transformations based on conditions * Type assertions and type guards: managing type narrowing If you need a refresher on these topics, please review the relevant sections in the Advanced TypeScript Features module: * [Generics](https://www.typescriptlang.org/docs/handbook/generics.html) * [Mapped Types](https://www.typescriptlang.org/docs/handbook/advanced-types.html#mapped-types) * [Conditional Types](https://www.typescriptlang.org/docs/handbook/advanced-types.html#conditional-types) * [Type Assertions and Type Guards](https://www.typescriptlang.org/docs/handbook/advanced-types.html#type-assertions-and-type-guards) **Lab Exercise** Create a generic class called `Container` that stores a value of a given type. The class should have the following properties and methods: * `value`: a property that stores the value of the given type * `setSize`: a method that sets the size of the container * `getSize`: a method that returns the size of the container The class should use generics to work with multiple types. For example, you should be able to create a `Container<string>` or a `Container<number>`. Additionally, the class should use mapped types to create a type that represents the size of the container. The size should be represented as a type parameter `S` that extends the `number` type. **Solution** ```typescript // Define a type parameter S that extends the number type type Size<S extends number> = S; // Define the Container class with generics and mapped types class Container<T, S extends number> { // Define the value property with type T private value: T; // Define the size property with type Size<S> private size: Size<S>; // Define the constructor with type parameters T and S constructor(value: T, size: Size<S>) { this.value = value; this.size = size; } // Define the setSize method with type parameter S setSize(size: Size<S>) { this.size = size; } // Define the getSize method that returns the size with type Size<S> getSize(): Size<S> { return this.size; } // Define the getValue method that returns the value with type T getValue(): T { return this.value; } } // Example usage const container = new Container<string, 100>('Hello', 100); console.log(container.getValue()); // Output: Hello console.log(container.getSize()); // Output: 100 container.setSize(200); console.log(container.getSize()); // Output: 200 ``` **Key Concepts** * Generics: reusable components with type parameters * Mapped types: transforming types with a map-like syntax * Conditional types: type transformations based on conditions (not used in this example) * Type assertions and type guards: managing type narrowing (not used in this example) **Practical Takeaways** * Use generics to create reusable components that work with multiple types * Use mapped types to create more complex type transformations * Use conditional types to create type transformations based on conditions * Use type assertions and type guards to manage type narrowing **Leave a Comment/Ack Help** If you have any questions or need help with this lab, please leave a comment below. I'll be happy to assist you. **What's Next?** In the next topic, we will cover "Understanding modules: exporting and importing code" from the Modules and Namespaces module. This will help you to organize and reuse your code more efficiently.