Default generic types in Typescript - Practice Problems & Coding Challenges

Challenge - 5 Problems

❓ Predict Output

intermediate

Output of function with default generic type

What is the output of the following TypeScript code?

Typescript

function identity<T = string>(value: T): T {
  return value;
}

const result = identity(123);
console.log(typeof result);

A "undefined"

B "string"

C "object"

D "number"

💡 Hint

The generic type defaults only if no type is inferred or specified.

The function is called with a number argument (123). TypeScript infers T as number, so the default string is ignored. The typeof result is 'number'.

❓ Predict Output

intermediate

Default generic type usage in class

What will be the type of the property value in the following TypeScript class instance?

Typescript

class Box<T = boolean> {
  value: T;
  constructor(value: T) {
    this.value = value;
  }
}

const box = new Box(42);
// What is the type of box.value?

A number

B boolean

C string

D any

💡 Hint

TypeScript infers generic types from constructor arguments if possible.

The generic type T is inferred as number from the argument 42, so box.value is of type number, not the default boolean.

🔧 Debug

advanced

Identify the error with default generic type usage

Which option will cause a TypeScript error when compiling this code?

Typescript

function wrap<T = string>(value: T): { wrapped: T } {
  return { wrapped: value };
}

const result = wrap();

A No error, result is { wrapped: string } with value undefined

B No error, result is { wrapped: undefined }

C Error: Expected 1 argument, but got 0

D Error: Type 'undefined' is not assignable to type 'string'

💡 Hint

Default generic types do not provide default function arguments.

The function wrap requires one argument. The default generic type only applies to the type parameter, not the function parameter. Calling wrap() without arguments causes a compile error.

🧠 Conceptual

advanced

Effect of default generic types on type inference

Consider the function merge below. What is the type of result when calling merge({a: 1})?

Typescript

function merge<T = { a: number }, U = { b: string }>(obj1: T, obj2?: U): T & U {
  return { ...obj1, ...obj2 } as T & U;
}

const result = merge({ a: 1 });

A { a: number } & { b: string }

B { a: number } & undefined

C { a: number }

D Error: Argument of type '{ a: number; }' is not assignable to parameter of type '{ a: number; } & { b: string; }'

💡 Hint

Optional parameters can be omitted, so U is not inferred and defaults apply.

T is inferred as { a: number } from obj1. U defaults to { b: string } because obj2 is optional and omitted. The return type is explicitly T & U, so the type of result is { a: number } & { b: string }.

❓ Predict Output

expert

Complex default generic types with constraints

What is the output of this TypeScript code when compiled and run with Node.js?

Typescript

function processItem<T extends { id: number } = { id: number; name: string }>(item: T): string {
  return `ID: ${item.id}`;
}

console.log(processItem({ id: 10, name: "Test" }));
console.log(processItem({ id: 20 }));

A ID: 10\nError: Property 'name' is missing in second call

B ID: 10\nID: 20

C Error: Argument of type '{ id: number; }' is not assignable to parameter of type '{ id: number; name: string; }'

D ID: 10\nID: undefined

💡 Hint

Default generic types with constraints allow narrower types to be passed.

The generic type T defaults to { id: number; name: string } but can be any type extending { id: number }. Both calls pass valid objects. The function returns the id property as string for both calls.