TypeScript Survival Guide

Favorite typescript videos

088 — Function Signatures (pinning params and return type before implementation)

Full companion narrative for TypeScript Tutorial #10 — signatures as contracts: positional param names, the missing-else return error in calc, object-shape parameters, and composition with a type alias

Video: 088 · TypeScript Tutorial #10 - Function Signatures · watch · ~7:45 · Net Ninja TypeScript tutorial series, lesson 10 (Shaun)

Source: this is a written companion to the video. Part of the Favorite TypeScript Videos curated path, module 04 (functions and generics). Lesson 8’s Function type admits any function — signatures admit exactly one shape.

a signature describes the structure before the body

“A function signature basically describes the general structure of a function” — “What arguments it takes in and what type of data it returns.” The degenerate case sets the pattern: () => void takes no arguments and returns void.

loose Function setup before the three examples

example 1 — greet: param names are positional, not nominal

let greet: (a: string, b: string) => void;
greet = (name: string, greeting: string) => {
	console.log(`${name} says ${greeting}`);
};

greet assigned under the loose type

The implementation names (name, greeting) need not match the signature names (a, b): “It just means that we have two parameters, these can be called whatever you want, X and Y, if you prefer, it doesn’t really matter.” Count and types must match; names need not. And the void return is inferred on the implementation — no explicit annotation needed since nothing is returned.

greet signature with the implementation below it

example 2 — calc: every code path must return

let calc: (a: number, b: number, c: string) => number;
calc = (numOne: number, numTwo: number, action: string): number => {
	if (action === "add") {
		return numOne + numTwo;
	} else {
		return numOne - numTwo;
	}
};

“It takes 3 parameters, number, number, string, and it returns a number at the end.” The lesson’s key error: a first version with only the if branch fails the signature — the else fix makes every path return a number.

calc declared, then implemented with the add/subtract branches

calc mid-edit with the missing-branch error

example 3 — logDetails: object-shape parameter, composed with an alias

let logDetails: (obj: { name: string; age: number }) => void;
logDetails = (ninja) => {
	console.log(`${ninja.name} is ${ninja.age} years old.`);
};

type Person = { name: string; age: number };
let logDetails2: (obj: Person) => void;

“This must be an object with a name and an age which both have string and number types.” The close composes lesson 9 into lesson 10: the inline shape becomes type Person, and the signature references the alias — the pattern the Finance Logger project will use.

logDetails with the object-shape parameter

hover detail on the object parameter

full file: greet, calc, logDetails, and the Person alias

Prev: 087 — Type Aliases · Next: 089 — The DOM & Type Casting

The auto-transcript is clean on code but loose on naming; this narrative uses the corrected forms: Person in PascalCase for the composed alias (transcript lowercase “person”), ninja for the implementation parameter, and template-string reporting for the console.log calls.