Function Overloads & this Types

Function overloads let a single function expose several typed call shapes, while related tools — call signatures, typed optional/default/rest parameters, and the this parameter — give you precise control over how a function is called.

Learn Function Overloads & this Types in our free TypeScript course — an interactive lesson with runnable examples, a practice exercise and a quick reference.

Part of the free TypeScript course at LearnCodingFast — hands-on lessons with examples you run in your browser, plus practice exercises and a quick quiz.

Overloads are like a menu with set combos . Out back there's one kitchen (the single implementation), but the menu lists distinct, well-defined orders: "Combo A gives you a burger", "Combo B gives you a salad". You order a specific combo and know exactly what you'll get — you never order "the raw kitchen". The this parameter, meanwhile, is the kitchen insisting it must be cooking in its own kitchen , not someone else's.

1. Function Overloads

A function overload is written as several signature lines with no body , followed by one implementation with a body. Each signature describes a distinct, valid way to call the function — and crucially, the return type can differ per signature. The implementation signature must be broad enough to accept every overload, but callers only ever see the specific overloads, never the implementation.

2. Optional, Default & Rest Parameters

Parameters can be optional ( title?: string — may be omitted), have a default ( greeting = "Hello" — used when no argument is given), or be a rest parameter ( ...nums: number[] — gathers any number of trailing arguments). The rest parameter must always come last, and a typed rest gives you variadic functions that stay fully checked.

3. Call Signatures & this Parameters

A call signature types an object that is itself callable and carries extra properties — like a counter function that also has a count . A this parameter is a special first parameter that declares what this must be inside the function; it's purely a type annotation (erased at runtime) that stops you calling a method with the wrong receiver.

🎯 Your Turn

Complete the single implementation of an overloaded describe that handles a number or a string. Fill in the two blanks marked ___ , then run it.

No blanks this time — just a brief and a starting outline. Build the overloaded parser and the rest-param average yourself, run it, and check your output against the example in the comments.

Practice quiz

How are function overloads written in TypeScript?

  • Several functions with the same body
  • One signature and several bodies
  • Multiple overload signatures (no body) plus ONE implementation with a body
  • Using the 'overload' keyword

Answer: Multiple overload signatures (no body) plus ONE implementation with a body. You declare two or more signature headers with no body, then one implementation that covers them all.

Which signature can callers actually call?

  • Only the overload signatures
  • Only the implementation signature
  • Both equally
  • Neither

Answer: Only the overload signatures. Callers see only the overload signatures; the broad implementation signature is hidden from them.

When do overloads beat a single union-parameter signature?

  • Never
  • When there is only one parameter
  • When performance matters
  • When the RETURN type depends on which argument type was passed

Answer: When the RETURN type depends on which argument type was passed. Overloads express input-to-output relationships, e.g. make("point") returns an object, make("name") a string.

The implementation signature must be:

  • The narrowest of all overloads
  • General enough to cover every overload
  • Identical to the first overload
  • Omitted entirely

Answer: General enough to cover every overload. The implementation params/return must be broad enough (e.g. string | unknown[]) to accept all overloads.

What is a 'this' parameter?

  • A TypeScript-only annotation declaring what 'this' must be, erased at runtime
  • A real first argument callers pass
  • A global variable
  • A class field

Answer: A TypeScript-only annotation declaring what 'this' must be, erased at runtime. A this parameter is a compile-time-only annotation in the first position; it has zero runtime cost.

Where must a rest parameter appear in the parameter list?

  • First
  • Anywhere
  • Last
  • Only with no other parameters

Answer: Last. The rest parameter must always come last.

What does an optional parameter (title?: string) become when omitted?

  • null
  • undefined
  • an empty string
  • a compile error

Answer: undefined. An omitted optional parameter is undefined inside the function.

What does a default parameter (greeting = "Hi") do?

  • Forces the caller to pass it
  • Makes the parameter required
  • Throws if omitted
  • Supplies a value when the argument is missing

Answer: Supplies a value when the argument is missing. A default supplies its value when no argument is given, so it is never undefined.

A call signature like 'type Counter = { (): number; count: number }' describes:

  • A plain object
  • A callable object that also carries extra properties
  • A class
  • A union type

Answer: A callable object that also carries extra properties. A call signature types something that is callable AND has additional members like count.

How should overloads be ordered?

  • Most general to most specific
  • Alphabetically
  • Most specific to most general (TS picks the first match)
  • Order does not matter

Answer: Most specific to most general (TS picks the first match). TypeScript picks the first matching overload, so order from most specific to most general.