Понимание уникальных атрибутов, определяющих чистые функции в JavaScript.

После окончания буткемпа по кодированию я потратил большую часть своего времени на более глубокое понимание JavaScript. На протяжении всего обучения я сталкивался с разнообразной терминологией, которую знал, но не мог определить самостоятельно. Сегодня мы познакомимся с одним из терминов — чистые функции.

Что такое чистая функция?

В простом смысле функция — это процедура, которая получает входные данные, а затем возвращает выходные данные. У чистой функции есть два дополнительных атрибута.

  1. При одинаковых входных данных чистая функция всегда будет возвращать одинаковые выходные данные.
  2. Чистая функция не имеет никаких побочных эффектов.

Давайте углубимся в эти специфические качества.

1. Один и тот же вход всегда будет давать один и тот же результат

Взгляните на следующий блок кода.

const pureFunction = num => {
  return num * 10;
}
pureFunction(5); // 50

Учитывая аргумент 5, вышеприведенная функция всегда будет возвращать 50, несмотря ни на что.

Для сравнения, давайте посмотрим на приведенную ниже функцию.

const notPureFunction = num => {
  return num * Math.floor(Math.random() * (11 - 1) + 1);
}
notPureFunction(5); // 15 (5 * 3)
notPureFunction(5); // 35 (5 * 7)
notPureFunction(5); // 20 (5 * 4)

Вы можете видеть, что мы генерируем случайное число от 1 до 10 в теле notPureFunction. Даже при одном и том же входном значении мы получаем различные выходные данные. Мы сразу же понимаем, что это не чистая функция.

2. Не вызывает побочных эффектов

Чтобы функция была чистой, она не должна вызывать побочных эффектов. Примеры общих побочных эффектов включают:

  1. Мутирующие входы
  2. Изменение переменных вне функции
  3. HTTP-вызовы
  4. console.log

Ниже у нас есть нечистая функция. Он принимает два аргумента: массив и значение, добавляемое к массиву.

const myBasket = ['apple', 'orange']
const addFruitToBasket = (basket, fruit) => {
  basket.push(fruit)
  return basket
}
addFruitToBasket(myBasket, 'strawberry') // ['apple', 'orange', strawberry'] 
// myBasket is now equal to ['apple', 'orange', strawberry']

Когда выполняется addFruitToBasket, значение, определенное вне функции, изменяется. Это побочный эффект. Мы сразу знаем, что addFruitToBasket — нечистая функция.

Давайте настроим addFruitToBasket как чистую функцию.

const myBasket = ['apple', 'orange']
const addFruitToBasket = (basket, fruit) => {
  const newBasket = [...basket]
  newBasket.push(fruit)
  return newBasket
}
addFruitToBasket(myBasket, 'strawberry') // ['apple', 'orange', strawberry'] 
// myBasket is unchanged, still equal to ['apple', 'orange']

Теперь, когда выполняется addFruitToBasket, мы создаем новый массив. myBasket не изменяется, и ничего за пределами функции не меняется.

Вывод

Чистые функции являются основным компонентом Функционального программирования. Поскольку они не производят побочных эффектов, чистые функции чрезвычайно портативны и их можно легко перемещать. Чистые функции всегда будут возвращать один и тот же результат при одинаковых входных данных. Это делает их предсказуемыми и улучшает тестируемость. Эти черты позволяют создавать гибкий и легко адаптируемый код.