Types & Interfaces
14 min
An interface describes the SHAPE an object must have — which
properties, and their types — without providing any implementation.
Unlike a class, an interface produces no runtime code at all: it's
purely a compile-time contract the TypeScript compiler checks for you,
then erases completely when it compiles down to plain JavaScript. A
function parameter typed as (p: Point) gets full property
autocomplete and a compile error if you pass something missing x or
y — but the JAVASCRIPT that actually runs has no idea Point ever
existed.
interface Point {
x: number;
y: number;
}
function distance(a: Point, b: Point): number {
return Math.sqrt((a.x - b.x) ** 2 + (a.y - b.y) ** 2);
}
console.log(distance({ x: 0, y: 0 }, { x: 3, y: 4 }));
// 5
This lesson's exercises grade by running the TRANSPILED JavaScript (types stripped), not full static type-checking -- so they can only verify TS features with an observable runtime effect, like this function's actual arithmetic.
Define an `interface Point { x: number; y: number; }`, then write `distance(a: Point, b: Point): number` returning the Euclidean distance between them (`sqrt((a.x-b.x)^2 + (a.y-b.y)^2)`).
At runtime, in the compiled JavaScript, what happens to an `interface` declaration?
You can define interfaces to describe object shapes and use them to type function parameters, and you understand that they vanish entirely at runtime.