React with TypeScript Quiz

Question 1

How should you type a component's props today?

Accepted Answer

By annotating the props parameter directly

Answer

With React.FC<Props>

Answer

With PropTypes

Answer

By typing the return value only

Question 2

Which type covers anything React can render?

Accepted Answer

React.ReactNode

Answer

React.ReactElement

Answer

JSX.Element

Answer

React.Component

Question 3

How do you make a wrapper accept every prop the underlying button accepts?

Accepted Answer

Extend React.ComponentProps<"button">

Answer

Type the props as any

Answer

Use Record<string, unknown>

Answer

List every attribute manually

Question 4

What is wrong with useState([])?

Accepted Answer

TypeScript infers never[], so nothing can be added to the array

Answer

It is a syntax error

Answer

It infers any[], removing type safety

Answer

Arrays cannot be state

Question 5

Why type a context as AuthValue | null and guard it in a hook?

Accepted Answer

The guard both catches a missing provider at runtime and narrows the type for every caller

Answer

Contexts must always allow null

Answer

It makes the context faster

Answer

null is the only valid default

Question 6

Which type describes a change event on a text input?

Accepted Answer

React.ChangeEvent<HTMLInputElement>

Answer

React.FormEvent<HTMLInputElement>

Answer

Event

Answer

React.SyntheticEvent

Question 7

Why prefer currentTarget over target in a typed handler?

Accepted Answer

currentTarget is typed as the element the handler is attached to, while target is the more general EventTarget

Answer

It is faster

Answer

target is deprecated

Answer

currentTarget works in more browsers

Question 8

Why prefer a status union over separate boolean flags?

Accepted Answer

A union makes impossible combinations such as loading and error at once unrepresentable

Answer

Unions render faster

Answer

Booleans cannot be used in state

Answer

Unions are required by strict mode