yoklainterview sim
ProgressHistory

Frontend Typescript Generics Interview Questions

75 verified Frontend Typescript Generics interview questions — solve with answers, learn from explanations, test yourself in a real simulation.

Try the real simulation →

Sample questions

Typescript GenericsDifficulty 1
What is the main benefit of writing function identity<T>(x: T): T { return x; } instead of function identity(x: any): any { return x; }?
  • aThe generic version runs faster at runtime
  • bThe generic version preserves the input's specific type in the return value✓
  • cThe generic version allows any type to be passed without restriction, exactly like any
  • dThe generic version is only needed for class methods, not plain functions
Explanation:With any, the function's return type is always any — TypeScript loses track of what was actually passed in, so identity(5) + 1 and identity(5).toUpperCase() both type-check with no error. With T, the compiler captures the actual argument's type and returns that same type, so calling identity(5) gives back number, letting the compiler catch identity(5).toUpperCase() as an error.
Typescript GenericsDifficulty 1
function first<T>(arr: T[]): T {
  return arr[0];
}
const result = first([1, 2, 3]);

What type does TypeScript infer for result?
  • aany
  • bT
  • cnumber✓
  • dnumber[]
Explanation:TypeScript infers T from the argument passed to first — since [1, 2, 3] is number[], T is inferred as number, so first's return type resolves to number. No explicit type argument is needed; inference does this automatically from the call site.
Typescript GenericsDifficulty 1
function wrap<T>(x: T): T[] {
  return [x];
}
const result = wrap("hi");

What type does result have?
  • astring[]✓
  • bstring
  • cT[]
  • dany[]
Explanation:T is inferred from the argument "hi", which has type string, so T becomes string and the return type T[] resolves to string[]. TypeScript's inference happens per call — a later call wrap(5) would independently infer T as number, giving number[].
Typescript GenericsDifficulty 2
function identity<T>(x: T): T {
  return x;
}
identity<string>(5);

What happens when this line is type-checked?
  • aIt compiles fine; T is inferred as number regardless of the explicit <string>
  • bIt compiles fine; TypeScript silently converts 5 to "5"
  • cIt only errors at runtime, not during compilation
  • dIt is a type error✓
Explanation:When a type argument is explicitly supplied (identity<string>), TypeScript uses that instead of inferring from the argument, and then checks the actual argument against it. Since 5 (type number) isn't assignable to string, this fails to compile — it's a compile-time type error, not a silent conversion or a runtime-only issue.
Typescript GenericsDifficulty 2
class Box<T> {
  constructor(public value: T) {}
}
const b = new Box(5);

What type does b.value have?
  • aT
  • bnumber✓
  • cany
  • dBox<T>
Explanation:Box<T> is a generic class; when constructed as new Box(5), TypeScript infers T from the constructor argument 5 (type number), so this instance is Box<number> and b.value has type number. No explicit new Box<number>(5) was needed — inference works the same way for class constructors as for functions.
Typescript GenericsDifficulty 2
In function pick<T extends { id: number }>(x: T): number { return x.id; }, what does T extends { id: number } mean?
  • aT must be exactly the type { id: number }, with no other properties allowed
  • bT is optional and defaults to { id: number } if not provided
  • cT can be any type, as long as it has at least an id property of type number✓
  • dT must be a subclass of a class named { id: number }
Explanation:A generic constraint (extends) restricts what T is allowed to be, but doesn't require an exact match — T just needs to be assignable to the constraint, meaning it must have (at minimum) an id: number property. Extra properties are fine: { id: number, name: string } satisfies this constraint too.

By specialization

Angular 450JavaScript 450React 450TypeScript 450Vue 450

By seniority

Frontend JuniorFrontend MidFrontend Senior

Other fields

BackendFullstackDevOps / CloudAI EngineerDatabaseMobileSecurityQA / Test AutomationData EngineerGame DevelopmentML Engineer

Test yourself against the 2925-question Frontend bank.

Start interview