Dispatch functions by key — JS: Polymorphism

Dispatching by associative array key is more powerful than it might seem at first sight. Sometimes selecting different data is not enough. So you have to execute other code.

Suppose we need to generate an array with the last names of our users. The main condition is that for girls, we take their maiden name.

Let's implement this task using good old if statements:

const lastNames = users.map((user) => {
  if (user.gender === 'female') {
    return user.maidenName;
  }
  return user.lastName;
});

Now let's solve this problem by dispatching by object keys, but unlike in the previous lesson, the values will be functions:

// Define a key-value. The key is a gender. The value is a function, which returns the desired value for the gender
const mapping = {
  female: (user) => user.maidenName,
  male: (user) => user.lastName,
};

// Select the desired function by the name of the gender and call it
// We pass the user to the function
const lastNames = users.map((user) => mapping[user.gender](user));

In some situations, this solution is better. It clearly shows dependencies, especially if there are a lot of them. In addition, data configuration allows you to take it elsewhere and extend the behavior without rewriting the code that uses that data.

Another example is parsing data depending on its type:

import yaml from 'js-yaml';

const mapping = {
  yml: yaml.load,
  json: JSON.parse
};

const parse = (type, data) => mapping[type](data);

Recommended materials

1. An example of using dispatch by key in Hexlet projects