TypeScript Advanced Types - Exercises, Practice, Solutions

TypeScript Advanced Types [13 exercises with solution]

[An editor is available at the bottom of the page to write and execute the scripts. Go to the editor]

Following exercises cover various aspects of advanced TypeScript topics, including union and intersection types, type guards, type assertions, generics, mapped types, and conditional types.

Union and Intersection Types:

1. Write a TypeScript program that declares a variable 'result' that can hold either a 'string' or a 'number'. Now write a function that takes an argument of type 'string | number | boolean' and logs its type.
Click me to see the solution

2. Write a TypeScript program that creates a function combine that accepts two parameters of types boolean and number. It returns a value that can be either a boolean or a number. Use a union type to achieve this.  
Click me to see the solution

3. Write a TypeScript program that defines a TypeScript interface Car with properties make and model of type string. Create a type Bus with properties make and model of type string and an additional property payloadCapacity of type number. Now, create a type Vehicle that represents either a Car or a Truck using a union type.  
Click me to see the solution

Type Guards:

4. Write a TypeScript function that takes an argument of type string | number. Inside the function, use a type guard to check whether the argument is a string or a number. Then, log the appropriate message accordingly.  
Click me to see the solution

5. Write a TypeScript function that accepts a parameter of type number and returns a boolean indicating whether the number is odd. Use a type guard to check and ensure the input is a valid number.  
Click me to see the solution

Type Assertions:

6. Write a TypeScript program that declares an array containing both numbers and strings. Use type assertions to extract number, string and boolean values from the array.  
Click me to see the solution

7. Write a TypeScript program that declares a variable as type any and uses a type assertion to explicitly cast it to type string.  
Click me to see the solution

8. Write a TypeScript function that accepts a parameter of type string | string[] and returns the length of the input string. It also returns the sum of the lengths of all strings in the array. Use type assertions to let TypeScript know the parameter type.  
Click me to see the solution

Generics:

9. Write a TypeScript generic function that accepts an argument of any type and returns the same value. Test the function with various data types.  
Click me to see the solution

10. Write a TypeScript generic function that accepts two arguments: an array of any type and two indices. The function should swap the elements at the specified indices and return the modified array.  
Click me to see the solution

Mapped Types:

11. Write a TypeScript program that creates a TypeScript mapped type called 'Optional'. This mapped type should take an object type as a parameter and make all its properties optional. Test the mapped type with an example object.  
Click me to see the solution

12. Write a TypeScript program that defines a mapped type. It takes an object type as a parameter and makes all its properties read-only (immutable). Test the mapped type with an example object.  
Click me to see the solution

Conditional Types:

13. Write a TypeScript program that creates a conditional type. The program takes an array and a type as parameters and returns an array containing only elements of the specified type. Test the conditional type with an array of mixed types and extract only numbers or strings, depending on the input type parameter.  
Click me to see the solution

More to Come !

TypeScript Editor

See the Pen TypeScript by w3resource (@w3resource) on CodePen.

Do not submit any solution of the above exercises at here, if you want to contribute go to the appropriate exercise page.