Programmer’s Reference
Learn JavaScript control flow with types, interfaces, and compile-time checks.
TypeScript 5+; satisfies requires 4.9+. Type annotations are erased during compilation and do not validate external data at runtime. Code examples are independent .ts files, checked with strict mode and an ES2020 target.
Select a term for its definition, syntax, example, and common mistakes.
Use an already installed project-local compiler to check types without generating JavaScript.
./node_modules/.bin/tsc --version
./node_modules/.bin/tsc --strict --noEmit --target ES2020 example.tsPractical usePractice in a standalone example file before using this pattern in your project.
Common mistakesInstall TypeScript as a development dependency first. Passing files directly does not read tsconfig.json; use tsc --project . for project settings.
Configure project-wide type checking. noEmit produces no compiled files.
{
"compilerOptions": {
"target": "ES2020",
"strict": true,
"noEmit": true
},
"include": ["src/**/*.ts"]
}Practical usePractice in a standalone example file before using this pattern in your project.
Common mistakesRun the project compiler with --project .; emitting JavaScript needs a separate build configuration or tool.
Declare variables and optionally specify their types.
const displayName: string = 'Demo';
let count: number = 0;
const ready: boolean = true;
count += 1;
console.log(displayName, count, ready);Practical usePractice in a standalone example file before using this pattern in your project.
Common mistakesUse lowercase string, number, and boolean. const prevents reassignment, not mutation inside objects.
Branch on a condition; typeof checks can narrow a union type.
function label(value: string | number): string {
if (typeof value === 'number') {
return value.toFixed(0);
} else {
return value.toUpperCase();
}
}
console.log(label(3));Practical usePractice in a standalone example file before using this pattern in your project.
Common mistakesA type annotation is not a runtime check. typeof null is "object".
Use short-circuit boolean logic inherited from JavaScript.
const nickname: string = '';
const label = nickname || 'Guest';
const ready: boolean = true;
if (ready && !nickname) { console.log(label); }Practical usePractice in a standalone example file before using this pattern in your project.
Common mistakes|| returns an operand, not necessarily a boolean. Zero and empty strings are falsey.
Use optional chaining for a missing object and nullish coalescing for a fallback.
function display(user: { name?: string } | undefined): string {
return user?.name ?? 'Guest';
}
console.log(display(undefined));Practical usePractice in a standalone example file before using this pattern in your project.
Common mistakes?? preserves zero and empty strings. Optional chaining does not make every subsequent property access safe.
Repeat work with JavaScript loop syntax and typed values.
const names: string[] = ['Demo', 'Example'];
for (const name of names) { console.log(name); }
for (let i = 0; i < names.length; i++) { console.log(i); }
let remaining = 2;
while (remaining > 0) { remaining--; }Practical usePractice in a standalone example file before using this pattern in your project.
Common mistakesfor...in visits property keys, while for...of visits iterable values. Avoid infinite loops.
Exit the enclosing loop or skip its current iteration.
for (let n = 0; n < 5; n++) {
if (n === 1) { continue; }
if (n === 3) { break; }
console.log(n);
}Practical usePractice in a standalone example file before using this pattern in your project.
Common mistakesbreak does not return from a function; continue requires a loop.
Describe function inputs and output; void means no useful returned value.
function doubleValue(n: number): number { return n * 2; }
function report(message: string): void { console.log(message); }
report(String(doubleValue(3)));Practical usePractice in a standalone example file before using this pattern in your project.
Common mistakesA return annotation is checked at compile time; it does not convert values.
Give a type a reusable name and restrict values to alternatives.
type State = 'ready' | 'waiting';
type Identifier = string | number;
const state: State = 'ready';
const id: Identifier = 7;
console.log(state, id);Practical usePractice in a standalone example file before using this pattern in your project.
Common mistakesA type alias does not create a runtime value. Narrow unions before using type-specific methods.
Describe an object shape, including optional and read-only properties.
interface Item {
readonly id: number;
name: string;
note?: string;
}
const item: Item = { id: 1, name: 'Demo' };
console.log(item.note ?? 'No note');Practical usePractice in a standalone example file before using this pattern in your project.
Common mistakesreadonly is a type-checking restriction, not a runtime freeze. Optional properties may be undefined.
Type a variable-length array or a fixed-position tuple.
const names: Array<string> = ['Demo'];
const counts: number[] = [1, 2];
const pair: [string, number] = ['Demo', 2];
console.log(names, counts, pair);Practical usePractice in a standalone example file before using this pattern in your project.
Common mistakes[number] is a one-element tuple, not a general array. Runtime arrays can still contain invalid external data.
unknown requires narrowing before use; any disables most type checking.
function describe(value: unknown): string {
return typeof value === 'string' ? value.toUpperCase() : 'Not text';
}
console.log(describe('Demo'));Practical usePractice in a standalone example file before using this pattern in your project.
Common mistakesPrefer unknown for untrusted values. Neither unknown nor any validates a JSON schema.
Tell the compiler how to treat a value without changing it.
const value: unknown = 'Demo';
const text = value as string;
console.log(text.toUpperCase());Practical usePractice in a standalone example file before using this pattern in your project.
Common mistakesAssertions do not validate or convert values; this succeeds only because the example value really is a string.
Preserve a relationship between input and output types.
function first<T>(values: T[]): T | undefined {
return values[0];
}
const result = first<string>(['Demo']);
console.log(result);Practical usePractice in a standalone example file before using this pattern in your project.
Common mistakesAn array may be empty, so this return type includes undefined.
Restrict keys to an object type and derive the corresponding value type.
function get<T, K extends keyof T>(object: T, key: K): T[K] {
return object[key];
}
console.log(get({ name: 'Demo', count: 3 }, 'name'));Practical usePractice in a standalone example file before using this pattern in your project.
Common mistakeskeyof is a type-level operation; Object.keys returns runtime strings with different guarantees.
Check compatibility while retaining a useful inferred type; as const preserves literal values.
const settings = { mode: 'ready', retries: 3 } as const satisfies {
mode: 'ready' | 'waiting';
retries: number;
};
console.log(settings.mode);Practical usePractice in a standalone example file before using this pattern in your project.
Common mistakessatisfies requires TypeScript 4.9+ and does not perform runtime validation.
Narrow a discriminated union and check that every variant is handled.
type Result = { kind: 'ok'; value: number } | { kind: 'error'; message: string };
function describe(result: Result): string {
switch (result.kind) {
case 'ok': return String(result.value);
case 'error': return result.message;
default: { const unreachable: never = result; return unreachable; }
}
}
console.log(describe({ kind: 'ok', value: 3 }));Practical usePractice in a standalone example file before using this pattern in your project.
Common mistakesKeep a literal discriminator on each variant. Adding a variant requires updating exhaustive switches.
Express asynchronous results with a typed promise.
async function getCount(): Promise<number> { return 3; }
async function main(): Promise<void> {
const count = await getCount();
console.log(count);
}
void main().catch(console.error);Practical usePractice in a standalone example file before using this pattern in your project.
Common mistakesawait requires an async function or a compatible top-level module setting; handle promise rejection.
TypeScript has no goto statement; use structured branches, loops, and functions.
function describe(ready: boolean): string {
if (ready) { return 'Ready'; }
return 'Waiting';
}
console.log(describe(true));Practical usePractice in a standalone example file before using this pattern in your project.
Common mistakesTypeScript uses JavaScript control-flow syntax; labels are not goto targets.