Why generic interfaces matter in Typescript - Test Your Understanding

Practice - 5 Tasks

1fill in blank

easy

Complete the code to declare a generic interface named Container.

Typescript

interface Container<[1]> {
  value: T;
}

Drag options to blanks, or click blank then click option'

AV

BU

CT

DX

Attempts:

3 left

💡 Hint

Common Mistakes

Using lowercase letters for generic type parameters.

Forgetting to add the generic parameter in angle brackets.

The generic type parameter T is used to define the type inside the interface.

2fill in blank

medium

Complete the code to create a variable of type Container holding a number.

Typescript

const numberContainer: Container<[1]> = { value: 42 };

Drag options to blanks, or click blank then click option'

Astring

Bnumber

Cboolean

Dany

Attempts:

3 left

💡 Hint

Common Mistakes

Using string when the value is a number.

Using any which is less specific.

We specify number as the generic type to hold a number value.

3fill in blank

hard

Fix the error in the function signature to accept a generic Container.

Typescript

function getValue<[1]>(container: Container<T>): T {
  return container.value;
}

Drag options to blanks, or click blank then click option'

AT

BV

CU

DW

Attempts:

3 left

💡 Hint

Common Mistakes

Using a different generic letter in the function than in the interface.

Omitting the generic parameter in the function.

The generic parameter T must match the one used in the parameter type Container<T>.

4fill in blank

hard

Fill both blanks to create a generic interface Pair with two types.

Typescript

interface Pair<[1], [2]> {
  first: [1];
  second: [2];
}

Drag options to blanks, or click blank then click option'

AA

BB

CT

DU

Attempts:

3 left

💡 Hint

Common Mistakes

Using the same letter for both generic parameters.

Using letters that do not match the property types.

The generic parameters A and B represent the types of the two values in the pair.

5fill in blank

hard

Fill all three blanks to create a function that returns the first element of a generic Pair.

Typescript

function getFirst<[1], [2]>(pair: Pair<[3], B>): A {
  return pair.first;
}

Drag options to blanks, or click blank then click option'

AA

BB

CT

DU

Attempts:

3 left

💡 Hint

Common Mistakes

Mixing up generic parameter letters.

Not matching the generic parameters in the function signature and parameter.

The function uses generic parameters A and B matching the Pair interface. The parameter pair is typed as Pair<A, B> and the return type is A.