Demystifying Monads: A Simple Guide for TypeScript Devs Using fp-ts

Monads. The word itself often evokes fear and confusion, especially if you’re new to functional programming (FP). But don’t worry—monads aren’t magical or overly abstract. In fact, they’re everywhere in our code, and once you get the hang of them, you’ll wonder how you ever lived without them.

This post will break down monads in a way that makes sense if you’re a TypeScript dev, especially if you’re working with the fp-ts library. We’ll walk through what a monad really is and show how you can use them to write cleaner, more predictable code.

What’s the Deal with Monads?

A monad is just a design pattern. It’s a tool for handling values—specifically, values that might involve extra stuff like computation, side effects, or uncertainty (like nullable values). If you’re familiar with Promise or Option types, you’ve already seen monads in action!

In super simple terms, a monad is:

1. A “container” that holds a value.
2. A set of operations that allow you to transform that value while keeping it wrapped in the container.

Why Do We Need Monads?

Let’s say you’re dealing with nullable values (like null or undefined). In regular TypeScript code, you’d probably write something like:

function getUserName(user: User | null): string {
  if (user === null) {
    return "Guest";
  }
  return user.name;
}

The issue here is the ugly null check. As your codebase grows, these checks pop up everywhere, cluttering your logic. Monads, like Option, help you abstract away these concerns by handling this mess for you.

The Monad in Action: Option

The Option type is a classic example of a monad. It’s used to represent values that might or might not be there, without resorting to null or undefined.

Here’s how you might work with Option using fp-ts:

import { Option, map, match } from "fp-ts/Option";

function getUserName(user: Option<User>): string {
  return pipe(
    user,
    map(u => u.name),
    match(
      () => "Guest",
      name => name
    ) // Handle the case where there's no user
  );
}

Breakdown:

• The Option monad wraps the user. It’s either some(user) or none.
• map is the magical function that lets us apply a transformation (u => u.name) to the wrapped value, but only if it exists (some case). Otherwise, nothing happens (none case).
• match is how we handle the “empty” case. If the user is none, we return 'Guest'.

Notice how there’s no if/else, no null checks—just smooth, declarative logic.

How Monads Work: The Essentials

At its core, a monad has three key pieces:

1. A type constructor: This is the “container” that wraps the value, like Option or Promise.
2. A function to wrap a value: This is called of (or some in Option), which puts a value into the monad.
3. A function to transform the value inside the container: This is usually map or flatMap (often called chain in fp-ts).

Let’s break down these concepts with an example using the Option monad.

1. The Type Constructor

A monad starts with a type constructor, like Option. It’s a container that can hold a value or represent the absence of one. So, some(value) means we have a value, and none means we don’t.

const someUser: Option<User> = some({ name: "Alice" });
const noUser: Option<User> = none;

2. The of Function

The of function (which is some in the case of Option) is used to put a value into the monad:

const user = some({ name: "Alice" }); // Wraps the user in an Option

3. The map and chain Functions

The map function is where the magic happens. It allows us to transform the value inside the monad without having to worry if it’s there or not.

const userName = pipe(
  some({ name: "Alice" }),
  map(user => user.name) // Transform the user inside the Option
);
// userName = some('Alice')

If we use none, the map function will simply skip the transformation:

const userName = pipe(
  none,
  map(user => user.name)
);
// userName = none

4. The chain Function

Sometimes you need to return a new monad from a transformation. That’s where chain (also called flatMap) comes in. It “unwraps” the result of a transformation and avoids nesting monads inside monads.

import { pipe } from "fp-ts/function";

const getUserOption = (id: number): Option<User> =>
  id === 1 ? some({ name: "Alice" }) : none;

const userOption = pipe(
  some(1),
  chain(getUserOption) // If we have an ID, look up the user
);
// userOption = some({ name: 'Alice' })

Wrapping It Up: Why Should You Care About Monads?

Monads allow you to write safer and cleaner code by handling scenarios like nullability, side effects, or asynchronous computations in a consistent way. With fp-ts, you get a whole toolkit of monads—like Option, Either, and Task—that let you handle uncertainty or failure with grace.

Without monads, your code will be littered with if-statements, error-handling code, and manual checks. With monads, you can express transformations in a clear and declarative way, and your code becomes more composable and testable.

TL;DR

• A monad is just a container with rules on how to transform values.
• It allows you to deal with computations that might involve uncertainty or side effects (like nullability or asynchronous data).
• In fp-ts, monads like Option help you handle values that may or may not exist, without having to worry about null or undefined.
• Key functions: map, chain, and fold, to transform and extract values safely.

Monads may seem intimidating at first, but once you start using them, you’ll see how much cleaner and more predictable your code becomes. Start small, use Option, and then explore other powerful monads in fp-ts!

Now go monad all the things!