Q: What TypeScript utility types (Partial, Pick, Omit, Record) come up most often when typing component props, and what's a case where you'd reach for each?

`Partial ` makes all properties of `T` optional - useful for an 'update' function or a component accepting default/override props where only some fields need to be provided (e.g., a form's initial values). `Pick ` selects a subset of propertie

Question 1

How would you type a React component's props when some props are mutually exclusive (e.g., either href or onClick, but not both)?

Accepted Answer

Plain object typing (`{ href？: string; onClick?: () => void }`) allows both, neither, or either - TypeScript won't catch a caller passing both. To make combinations mutually exclusive, model props as a discriminated union: define two separate shapes

Question 2

How do you correctly type a custom hook's return value, especially when returning a tuple like useState does?

Accepted Answer

If a hook returns an array intended to be destructured positionally (mirroring `useState`'s `[value, setValue]` convention), TypeScript by default infers the return type as a general array (`(T | U)[]`), which loses positional typing when destructure

Question 3

How would you type a generic reusable component (e.g., a > that works with any option type)?

Accepted Answer

Declare the component as a generic function component: `function Select(props: { options: T[]; value: T; onChange: (value: T) => void; getLabel: (option: T) => string }) { ... }`. TypeScript infers `T` from how the component is used (`

Question 4

What TypeScript utility types (Partial, Pick, Omit, Record) come up most often when typing component props, and what's a case where you'd reach for each?

Accepted Answer

`Partial` makes all properties of `T` optional - useful for an 'update' function or a component accepting default/override props where only some fields need to be provided (e.g., a form's initial values). `Pick` selects a subset of propertie

Question 5

Why is PropTypes considered legacy in a TypeScript codebase, and what changed with React 19 dropping it from the core package?

Accepted Answer

PropTypes was React's runtime prop-type checker: you declared expected shapes, and React logged a console warning in development if a mismatch occurred at render time. In a TypeScript codebase this is largely redundant - TypeScript catches the same c

React & React 19 Interview Questions

How would you type a React component's props when some props are mutually exclusive (e.g., either href or onClick, but not both)?

How do you correctly type a custom hook's return value, especially when returning a tuple like useState does?

How would you type a generic reusable component (e.g., a <Select<T>> that works with any option type)?

What TypeScript utility types (Partial, Pick, Omit, Record) come up most often when typing component props, and what's a case where you'd reach for each?

Why is PropTypes considered legacy in a TypeScript codebase, and what changed with React 19 dropping it from the core package?

Unlock the remaining 94 React & React 19 Questions & Verified Answers

React & React 19 Interview Questions

How would you type a React component's props when some props are mutually exclusive (e.g., either href or onClick, but not both)?

How do you correctly type a custom hook's return value, especially when returning a tuple like useState does?

How would you type a generic reusable component (e.g., a <Select<T>> that works with any option type)?

What TypeScript utility types (Partial, Pick, Omit, Record) come up most often when typing component props, and what's a case where you'd reach for each?

Why is PropTypes considered legacy in a TypeScript codebase, and what changed with React 19 dropping it from the core package?

Unlock the remaining 94 React & React 19 Questions & Verified Answers