/** * Observer — a subject keeps a list of dependants and tells them all when * something changes. */ type Unsubscribe = () => void; class Subject<T> { private readonly observers = new Set<(value: T) => void>(); subscribe(observer: (value: T) => void): Unsubscribe { this.observers.add(observer); // The subscription hands back its own undoing. The caller never needs // to hold on to the observer to be able to detach it. return () => { this.observers.delete(observer); }; } notify(value: T): void { // Iterate a copy: an observer is allowed to unsubscribe itself while

/** * Strategy — the part of an algorithm that varies, handed in rather than * branched on. */ type Pricing = (weightKg: number) => number; const standard: Pricing = (kg) => 4 + kg * 1.1; const express: Pricing = (kg) => 9 + kg * 2.4; const courtesy: Pricing = () => 0; // The quote knows nothing about how a price is arrived at. Adding a fourth // way to charge does not touch this function. function quote(weightKg: number, pricing: Pricing): string { return pricing(weightKg).toFixed(2); } const offers: [string, Pricing][] = [ ["standard", standard], ["express", express], ["courtesy", courtesy],

/** * Decorator — wrap a thing in another thing of the same shape. */ type Fetcher = (url: string) => Promise<string>; const plain: Fetcher = async (url) => `<${url}>`; // Each decorator takes a Fetcher and returns a Fetcher. Because the type // going in and the type coming out are identical, they compose in any order // and to any depth — nothing downstream can tell how many there are. const withLogging = (next: Fetcher): Fetcher => async (url) => { console.log(`fetching ${url}`); return next(url); }; const withCache = (next: Fetcher): Fetcher => { const seen = new Map<string, string>(); return async (url) => {

/** * Visitor — add new operations over a fixed set of shapes, without editing * the shapes. */ type Node = | { kind: "literal"; value: number } | { kind: "add"; left: Node; right: Node } | { kind: "negate"; operand: Node }; // This mapped type is the pattern's teeth. A visitor must supply a case for // every kind of node, so adding a fourth kind to Node breaks every visitor // in the codebase at compile time — which is exactly the reminder you want. type Visitor<T> = { [K in Node["kind"]]: (node: Extract<Node, { kind: K }>) => T; }; const walk = <T>(node: Node, visitor: Visitor<T>): T => visitor[node.kind](node as never); const evaluate: Visitor<number> = {

/** * Singleton — one instance, globally reachable, created on first use. */ class Registry { private static instance: Registry | null = null; private readonly entries = new Map<string, unknown>(); // The constructor is private, so `new Registry()` is a compile error. // This is the whole trick: the class takes away your ability to make one. private constructor() {} static getInstance(): Registry { if (Registry.instance === null) { Registry.instance = new Registry(); } return Registry.instance; } set(key: string, value: unknown): void {

/** * State — an object whose behaviour changes with its state, without a single * branch anywhere asking which state it is in. */ type Name = "idle" | "playing" | "paused"; type State = { readonly name: Name; press?: () => State; stop?: () => State; }; // A state is defined by the transitions it offers. One that omits a // transition cannot make it: `stop` on an idle player is not an error to // detect at runtime, it is a property that does not exist. // // Written as functions rather than plain values for a dull but unavoidable // reason — idle refers to playing and playing refers back to idle, and // values cannot be mutually recursive. const idle = (): State => ({ name: "idle", press: playing });

/** * Command — an action turned into an object, so that it can be kept, queued, * replayed, and taken back. */ interface Command { do(): void; undo(): void; } class Document { text = ""; } // Each command closes over everything it needs to reverse itself. Nothing // outside has to remember what was done, or in what order. function append(doc: Document, addition: string): Command { return { do: () => { doc.text += addition; },

/** * Iterator — traverse a collection without exposing how it is stored. */ class Ring<T> { constructor(private readonly items: readonly T[]) {} // Being iterable is a contract, not a base class: implement this one // well-known method and `for...of`, spread and destructuring all work. *[Symbol.iterator](): Generator<T> { for (const item of this.items) { yield item; } } // The same contract, unbounded. Nothing about a sequence requires it // to end — only that each step produces a value when asked. *cycle(): Generator<T> { if (this.items.length === 0) return; for (let i = 0; ; i = (i + 1) % this.items.length) { yield this.items[i];

Commissioned for this museum · after Gamma, Helm, Johnson & Vlissides, 1994

Strategy

TypeScript·1994·25 lines·705 bytes

/**
 * Strategy — the part of an algorithm that varies, handed in rather than
 * branched on.
 */
type Pricing = (weightKg: number) => number;

const standard: Pricing = (kg) => 4 + kg * 1.1;
const express: Pricing = (kg) => 9 + kg * 2.4;
const courtesy: Pricing = () => 0;

// The quote knows nothing about how a price is arrived at. Adding a fourth
// way to charge does not touch this function.
function quote(weightKg: number, pricing: Pricing): string {
	return pricing(weightKg).toFixed(2);
}

const offers: [string, Pricing][] = [
	["standard", standard],
	["express", express],
	["courtesy", courtesy],
];

for (const [name, pricing] of offers) {
	console.log(`${name}: ${quote(2, pricing)}`);
}

Curator’s note

The pattern is a single line: type Pricing = (weightKg: number) => number. Everything else in the file is a demonstration of what that line buys, which is the absence of a switch on a shipping-method string in the middle of quote.

In 1994 this was drawn as an interface with one method and a family of classes implementing it, and the drawing was the honest part — in a language without first-class functions, a one-method interface *is* how you pass behaviour around. Give the language closures and the ceremony evaporates: an interface with one method is a function type, and three classes become three declarations. Nobody writing this today would call it a pattern. They would call it an argument.

What survives the simplification is the design decision, which was never about classes. Somebody still has to notice that pricing varies, that quote should not know how, and that the variation belongs at the call site. That noticing is the whole pattern. The syntax it arrives in is incidental.

The cost is discoverability, and it is real. Three named strategies can be found, listed and tested; an anonymous arrow written inline at the call site cannot, and a codebase that has taken this pattern to heart tends to accumulate them. A class at least has to be declared somewhere you can grep for.

Elsewhere in the museum

LectureFunctional programming and object orientation
LectureThe principles of object orientation
TourWhat the book got right

Gallery of Patterns

Gallery of Patterns

Strategy

Curator’s note

Elsewhere in the museum