TypeScript Tutorial: Functions
Typed function parameters, return types, overloads, rest parameters, and higher-order functions.
Basic Function Syntax
```typescript
function add(a: number, b: number): number {
return a + b;
}
```
TypeScript checks both the **parameters** (what goes in) and the **return type** (what comes out).
---
Arrow Functions
```typescript
const multiply = (a: number, b: number): number => a * b;
// With a body:
const greet = (name: string): string => {
return `Hello, ${name}!`;
};
```
---
Optional and Default Parameters
```typescript
function createUser(name: string, role: string = "viewer", id?: number) {
return { id: id ?? Math.random(), name, role };
}
createUser("Alice"); // role = "viewer", id = random
createUser("Bob", "admin"); // id = random
createUser("Carol", "editor", 42); // all provided
```
---
Rest Parameters
```typescript
function sum(...numbers: number[]): number {
return numbers.reduce((total, n) => total + n, 0);
}
sum(1, 2, 3, 4, 5); // 15
```
---
Function Types
```typescript
type Transformer = (value: string) => string;
const uppercase: Transformer = (s) => s.toUpperCase();
const trim: Transformer = (s) => s.trim();
function applyAll(str: string, ...fns: Transformer[]): string {
return fns.reduce((s, fn) => fn(s), str);
}
```
---
What's Next?
Next: **Arrays** — typed arrays, tuples, and array methods in TypeScript.
What you'll learn in this TypeScript functions tutorial
This interactive TypeScript tutorial has 14 hands-on exercises. Estimated time: 20 minutes.
- Your first typed function — A function with typed parameters and a return type is a **contract**: TypeScript checks every caller and every return st…
- Arrow functions — concise syntax — Arrow functions with type annotations are the standard for callbacks, transformations, and one-liners. The return type c…
- Default parameters — avoid undefined — Default parameters provide fallback values when a caller doesn't pass an argument (or passes `undefined`). They're bette…
- Optional parameters — may or may not be provided — Mark a parameter with `?` to make it optional. Inside the function, TypeScript knows it may be `undefined` and enforces …
- Rest parameters — variable argument lists — Rest parameters collect any number of arguments into a typed array. They must be the last parameter.
- Function types — functions as values — In TypeScript, functions are first-class values. You can describe a function's shape with a type, then pass functions ar…
- Void return type — side-effect functions — `void` means the function doesn't return a meaningful value. It's used for functions whose purpose is a side effect: log…
- Overloads — multiple function signatures — Sometimes a function behaves differently depending on its argument types. Function overloads let you define multiple sig…
- Higher-order functions — functions that return functions — A higher-order function either takes functions as parameters or returns a function. This pattern is everywhere in TypeSc…
- Memoization — caching function results — Memoization caches function results for expensive computations. It's a classic higher-order function pattern.
- Callbacks with typed parameters — Array methods like `.map()`, `.filter()`, and `.reduce()` accept callbacks. When the array is typed, TypeScript knows th…
- Function composition — Function composition chains multiple functions together so the output of one becomes the input of the next. It's a power…
- Async functions — returning Promises — An `async` function always returns `Promise<T>`. TypeScript tracks the type inside the Promise so you know exactly what …
- never return type — exhaustive checks — `never` is the type for values that should never occur. It's used in exhaustive switch statements to make TypeScript err…
TypeScript Functions concepts covered
- Basic Function Syntax
- Arrow Functions
- Optional and Default Parameters
- Rest Parameters
- Function Types
- What's Next?