Рубрики
Без рубрики

Функции более высокого порядка – прагматический подход

Индолюция HOF – это обычное высказывание, что функции – это хлеб и масло программирования … помеченные JavaScript, HigherorderFunctiions, ES6, прагматичный.

Интолюция HOF

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

Строка кода говорит более тысячи слов. Давайте продолжим.

Существует много разных сценариев для приближения к HOF, но я бы перечислил некоторые общие, пока мы продолжаем

Фильтровать коллекции

Чтобы продемонстрировать простой пример, мы рассмотрим основную попытку получить только четные числа из коллекции, мы делаем следующее:

const nums = [1, 2, 3, 6, 8, 11];
const result = [];

for(let i=0; i < nums.length; i++) {
     if(nums[i] % 2 == 0) {
         result.push(i)
     }
     return result;
 }

result     // [2, 6, 8]

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

function filter(nums, test) {
      let result = [];
      for(let i=0; i

Только что написанная нами функция, ожидает коллекции в качестве первой

 let result = filter(nums, num => num % 2 == 0);
 result;      // [2, 6, 8]

Следует отметить, что функция пользовательской фильтра, определенная выше, является лишь наивной попыткой реализовать более надежные и эффективные встроенные Array.prototype.filter Встроенный метод для фильтрации коллекций массивов.

Группировка

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

function group(items, groupBy) {
        let grouped = Object.create(null);

        for(let i=0; i < items.length; i++) {
            let tag = groupBy(items[i])
            if(tag in grouped) {
                grouped[tag].push(items[i])
                continue;
            }
            grouped[tag] = [items[i]];

        }

        return grouped;
    }

Для этого примера мы использовали бы групповую функцию, которую мы только что определили для повторного арансуала коллекции, используя произвольный тег.

const items = [
     {tag: "car", name: "tesla", model: "Y"},
     {tag: "smartphone", name: "Samsung", yr: "2019"},
     {tag: "car", name: "mercedes", model: "classic"},
     {tag: "gaming", name: "PS5"},
     {tag: "smartphone", name: "Iphone", yr: "2019"}
]
const tagged = group(items, item => item["tag"]);

tagged   
/*
  {
     car: [
        { tag: 'car', name: 'tesla',model: "Y"},
        { tag: 'car', name: 'mercedes', model: "classic" }
     ],
     smartphone: [
        { tag:'smartphone', name: 'Samsung s9', yr: "2018" },
        { tag:'smartphone', name: 'Iphone 11', yr: "2019" }
     ],
     gaming: [ { tag: 'gaming', name: 'PS5' } ]
    }
*/

Круто, верно? 😊 С HOF мы можем легко выразить эту логику и при этом сохранять читаемость нашего кода.

Сплютирующие массивы

Я оставлю вас с этой попыткой сгладить вложенный массив произвольной глубины. Первая попытка будет использовать встроенный массив. Давайте сделаем это.

function flatten(nested) {
    return nested.reduce((flat, next) => {
        return Array.isArray(next) ? [...flat, ...next]
                                   : [...flat, next]
    }, [])
}

const nest = [1, 2, [3, 5], 0]
const deeper = [1, 2, [3, 5, [0, 9, 1]], 0]

flatten(deep)   // [1, 2, 3, 5, 0]
flatten(deeper)   // [1, 2, 3, 5, [0, 9, 1], 0]

Обратите внимание, что попытка выравнивать глубоко вложенный массив, казалось, не дала ожидаемого выхода 😦. Тем не менее, мы можем добиться большего успеха, и мы пробуем второй подход, но на этот раз используя старую старую технику рекурсии в сочетании с Array.Prototype.Reduce

function flatten(nested) {
    return nested.reduce((flat, next) => {

        if(Array.isArray(next)) {
            return [...flat, ...flatten(next)]
        }

        return [...flat, next]

    }, [])
};

flatten(deeper)  // [1, 2, 3, 5, 0, 9, 1, 0]

Виола, мы получаем результат, который мы ожидали. Оно работает!!! 😆

Вывод

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

Я надеюсь, что вам понравится эта статья, так же, как я ее выпустил. Пожалуйста, оставьте свой отзыв ниже.

Скажи привет Твиттер 💙 Прекрасные выходные вам!

Оригинал: “https://dev.to/nuel_ikwuoma/higher-order-functions-a-pragmatic-approach-51fb”

Читайте ещё по теме: