DEV Community

francesco agati
francesco agati

Posted on

Introduction to Functional Programming in JavaScript: Applicatives #10

Applicatives provide a powerful and expressive way to work with functions and data structures that involve context, such as optional values, asynchronous computations, or lists. Applicatives extend the concept of functors, allowing for the application of functions wrapped in a context to values also wrapped in a context.

What is an Applicative?

An applicative is a type of functor that not only supports mapping a function over a wrapped value (like a functor) but also allows for applying functions that are themselves wrapped in a context to values that are wrapped in a context. Applicatives provide a way to handle operations involving multiple functorial values.

Properties of Applicatives
  1. Identity: Applying a wrapped identity function to a wrapped value should yield the wrapped value. [ \text{A.of(x).ap(A.of(f))} \equiv \text{A.of(f(x))} ]
  2. Homomorphism: Applying a wrapped function to a wrapped value should produce the same result as applying the function to the value and then wrapping it. [ \text{A.of(f).ap(A.of(x))} \equiv \text{A.of(f(x))} ]
  3. Interchange: Applying a wrapped function to a wrapped value should be equivalent to applying the wrapped value to a function that applies the wrapped function. [ \text{A.of(f).ap(u)} \equiv \text{u.ap(A.of(f => f(x)))} ]

Implementing Applicatives in JavaScript

Let's explore how to implement and use applicatives in JavaScript.

Example: Implementing Maybe as an Applicative

The Maybe type is often used to represent optional values. Let's extend Maybe to support applicative operations.

class Maybe {
  constructor(value) {
    this.value = value;
  }

  static of(value) {
    return new Maybe(value);
  }

  map(fn) {
    return this.value === null || this.value === undefined
      ? Maybe.of(null)
      : Maybe.of(fn(this.value));
  }

  ap(maybe) {
    return this.value === null || this.value === undefined
      ? Maybe.of(null)
      : maybe.map(this.value);
  }
}

// Usage
const add = (a) => (b) => a + b;

const maybeAdd = Maybe.of(add);
const maybeTwo = Maybe.of(2);
const maybeThree = Maybe.of(3);

const result = maybeAdd.ap(maybeTwo).ap(maybeThree);
console.log(result); // Maybe { value: 5 }
Enter fullscreen mode Exit fullscreen mode

In this example, Maybe implements the ap method, which applies a function wrapped in a Maybe context to a value wrapped in another Maybe context. This allows for chaining operations involving optional values.

Working with Applicatives in Practice

Applicatives are particularly useful when dealing with computations that involve multiple contexts, such as combining multiple asynchronous operations or handling multiple optional values.

Example: Combining Multiple Promises

Let's see how applicatives can help in combining multiple promises.

const fetchData = (url) => {
  return new Promise((resolve) => {
    setTimeout(() => {
      resolve(`Data from ${url}`);
    }, 1000);
  });
};

const add = (a) => (b) => a + b;

const promiseAdd = Promise.resolve(add);
const promiseTwo = fetchData('url1').then((data) => parseInt(data.split(' ')[2]));
const promiseThree = fetchData('url2').then((data) => parseInt(data.split(' ')[2]));

const result = promiseAdd
  .then((fn) => promiseTwo.then((a) => fn(a)))
  .then((fn) => promiseThree.then((b) => fn(b)));

result.then(console.log); // Output after 2 seconds: NaN (since "from" cannot be parsed as an int)
Enter fullscreen mode Exit fullscreen mode

In this example, we combine multiple promises using the applicative pattern. While the example has a logical issue with parsing, it demonstrates how applicatives can be used to sequence operations that involve context.

Example: Handling Multiple Optional Values

Applicatives are also useful for combining multiple optional values.

const add = (a) => (b) => a + b;

const maybeAdd = Maybe.of(add);
const maybeFive = Maybe.of(5);
const maybeNull = Maybe.of(null);

const result1 = maybeAdd.ap(maybeFive).ap(maybeFive); // Maybe { value: 10 }
const result2 = maybeAdd.ap(maybeFive).ap(maybeNull); // Maybe { value: null }

console.log(result1); // Maybe { value: 10 }
console.log(result2); // Maybe { value: null }
Enter fullscreen mode Exit fullscreen mode

In this example, we use the applicative pattern to combine multiple Maybe values, handling the presence of null gracefully.

Top comments (0)