React Design Patterns and Best Practices(Second Edition)
上QQ阅读APP看书,第一时间看更新

First-class objects

In JavaScript, functions are first-class objects, which means that they can be assigned to variables and passed as parameters to other functions.

This allows us to introduce the concept of higher-order functions (HoFs). HoFs are functions that take a function as a parameter, optionally some other parameters, and return a function. The returned function is usually enhanced with some special behaviors.

Let's look at a simple example where there is a function for adding two numbers that gets enhanced with a function that first logs all the parameters and then executes the original one:

const add = (x, y) => x + y;

const log = fn => (...args) => {
console.log(...args);
return fn(...args);
};

const logAdd = log(add);

This concept is pretty important to understand, because, in the React world, a common pattern is to use HoCs, to treat our components as functions, and to enhance them with common behaviors. We will see HoCs and other patterns in Chapter 4Compose All the Things.