Что такое функции высшего порядка в JS?
Слышали ли вы, как ваши коллеги говорят о функциях высшего порядка в JavaScript? Не волнуйтесь, если вы потерялись в разговоре и не знаете, что это такое. В этом посте мы узнаем о функциях высшего порядка и о том, почему они полезны.
Давайте разберемся с определением:
Функция, которая принимает и/или возвращает другую функцию, называется функцией высшего порядка.
Функция высшего порядка так называется, потому что вместо строк, чисел или булевых символов она переходит на более высокий уровень, работая с другими функциями.
Функция высшего порядка - это функция, которая получает функцию в качестве входного аргумента или возвращает функцию в качестве выходного. Это концепция, которая родилась из функционального программирования. Возможно, это чуждое понятие для тех, кто больше привык к миру ООП. JS - это язык, который в последнее время начал использовать многие концепции функционального программирования. Функции высшего порядка - одна из них.
Почему функции высшего порядка?
Прежде чем приступить к изучению чего-либо, необходимо понять, почему это важно. Возможно, вам интересно, какой цели служат функции высшего порядка?
Простой и элегантный код
Функции высшего порядка помогают писать простой и чистый код. Это позволяет вам писать более мелкие функции, которые делают только одну вещь. В результате такой композиции получается легкий, читабельный код.
Меньше багов
При простом и элегантном коде в итоге вы получаете меньше ошибок. Поверьте мне в этом.
Легко тестировать и отлаживать
При использовании функций, выполняющих только одну задачу, вы получаете код, который легко тестировать. Тестируемый код приводит к меньшему количеству ошибок. Поэтому отладка этих простых функциональных единиц также проста.
Встроенные функции высшего порядка в JS
JavaScript поставляется с некоторыми встроенными функциями высшего порядка. Возможно, вы уже используете их, не осознавая, что это функции высшего порядка. Давайте рассмотрим некоторые из них, чтобы понять, как они работают.
Array.prototype.map
Метод map()
создает новый массив с результатами вызова предоставленной функции для каждого элемента вызываемого массива. Это означает, что map()
вызывает предоставленную функцию обратного вызова (callback) один раз для каждого элемента массива по порядку и создает новый массив из результатов.
Функция обратного вызова принимает три аргумента:
Возможно, вы уже использовали функцию map()
. Она квалифицируется как функция высшего порядка, поскольку в качестве входного аргумента принимает функцию обратного вызова.
const numbers = [1, 4, 9]; const doubles = numbers.map(num => { return num * 2; }); // двойники теперь [2, 8, 18] // цифры по-прежнему [1, 4, 9]
В приведенном выше примере у нас есть массив чисел, и мы создаем новый массив с помощью map()
. Функция map()
принимает функцию в качестве аргумента. Аргумент num
в функции будет автоматически присваиваться каждому элементу массива по мере того, как map()
будет проходить по исходному массиву.
Array.prototype.filter
Метод filter()
- это еще один пример встроенной функции высшего порядка. Он создает новый массив со всеми элементами, которые проходят тест, предоставленный функцией обратного вызова. Он также принимает функцию в качестве аргумента, что делает его функцией высшего порядка. Функция обратного вызова, переданная методу filter()
, принимает три аргумента:
Элементы массива, не прошедшие проверку обратного вызова, просто пропускаются и не включаются в новый массив.
Давайте рассмотрим пример, который показывает filter() в действии.
function isAboveMyRange(value) { return value >= 25; } const filtered = [12, 5, 8, 130, 44].filter(isAboveMyRange); // отфильтровано [130, 44]
Пример используется для поиска значений больше или равным 25 и фильтрации массива. Значения, не прошедшие этот тест, не войдут в отфильтрованный массив. Функция filter()
принимает функцию isAboveMyRange
в качестве входного параметра.
Array.prototype.reduce
Еще одной встроенной функцией высшего порядка в JavaScript является метод reduce()
. Она выполняет функцию обратного вызова на каждом члене вызывающего массива, в результате чего получается одно выходное значение. Метод reduce()
принимает два входных параметра:
- Функция обратного вызова редуктора (превращая этот метод в функцию высшего порядка)
- Необязательное начальное значение
arr.reduce(callback[, initialValue])
Функция reducer (обратного вызова) принимает четыре параметра:
Если указано initialValue
, то накопитель будет равен initialValue
, а currentValue
будет равен первому элементу массива. Если initialValue
не указано, то накопитель будет равен первому элементу массива, а currentValue
- второму элементу массива. Давайте попробуем лучше понять это на простом примере.
const sum = [0, 1, 2, 3].reduce((accumulator, currentValue) => { return accumulator + currentValue; }, 0); // сумма равна 6
В этом примере мы передали начальное значение InitialValue
, равное нулю, оно присваивается накопителю в самом начале. Каждый раз, когда функция reduce()
вызывается для каждого значения в массиве, в накопителе хранится результат предыдущей операции, возвращенный из функции, а currentValue
устанавливается в текущее значение массива. В конце результат сохраняется в переменной sum
.
Вы можете написать свои собственные функции высшего порядка
Мы рассмотрели несколько примеров встроенных функций высшего порядка, которые поставляются с JavaScript. Но это еще не все. Вы всегда можете создать свои собственные функции высшего порядка в зависимости от ваших потребностей.
Заключение
В этой статье мы узнали, что такое функции высшего порядка, а также познакомились с некоторыми встроенными функциями высшего порядка в JavaScript. Возможно, вы уже писали функции высшего порядка или использовали их, не понимая их значения.
Функции высшего порядка похожи на обычные функции, но они могут принимать функцию в качестве аргумента и/или возвращать функцию в качестве выхода.
Источник: https://programmingwithmosh.com/javascript/what-are-higher-order-functions-in-javascript/