What are type assertions and when should you use them?

Type assertions tell TypeScript to treat a value as a specific type, overriding inferred or declared types. They do NOT perform runtime conversion.

// as syntax (preferred)
const input = document.getElementById('name') as HTMLInputElement;
input.value; // now valid — TypeScript trusts your assertion

// angle-bracket syntax (avoid in .tsx files)
const input2 = <HTMLInputElement>document.getElementById('name');

// Non-null assertion operator (!) — asserts value is not null/undefined
const el = document.querySelector('.btn')!; // you assert it exists
el.click();

// Double assertion — escape hatch when types seem incompatible
const x = someValue as unknown as TargetType;

When to use:

• Narrowing DOM types (as HTMLInputElement) where TypeScript can't know the exact element
• After validating data from external sources where you've confirmed the shape
• Testing utilities where you intentionally pass partial objects

When NOT to use:

• As a shortcut to silence type errors — the error exists for a reason
• Instead of proper type guards that provide actual runtime safety

// ❌ Silencing a real bug
const user = getUser() as User; // getUser might return null!

// ✅ Proper guard
const maybeUser = getUser();
if (maybeUser !== null) {
  const user: User = maybeUser; // safe
}