Зарегистрируйтесь для доступа к 15+ бесплатным курсам по программированию с тренажером

Абстракция с помощью функций JS: Функции

Главная причина создания функций — повышение уровня абстракции, а не сокращение дублирования кода. Второе является следствием первого. И действительно, вместо того, чтобы реализовывать сортировку самостоятельно в каждом месте, где это требуется, можно воспользоваться функцией sort(), которая прячет реализацию внутри себя и позволяет программисту не отвлекаться на ненужные детали (вид сортировки, код для её выполнения).

Абстракция с помощью функций

В этом заключается суть абстракции, мы игнорируем несущественные стороны, свойства и связи рассматриваемого объекта или процесса, что позволяет представить сложную концепцию в более простой форме. Умение абстрагировать — одно из важнейших свойств нашего мозга. Маленькие дети очень быстро учатся классифицировать предметы нашего мира. Без особого труда понимая, что дерево это дерево, даже если конкретную породу дерева они видят впервые. А два разведённых пальца обозначают зайчика (потому что уши).

Несмотря на это, понимание, как грамотно строить абстракции (в нашем случае выделять функции), не появляется само по себе. Оно приходит с опытом, при условии, что есть другой человек сильнее вас, который может вам указать на допущенные ошибки, и вы сами отслеживаете проблемы вашей абстракции в процессе эксплуатации (рефлексируете). С другой стороны, излишнее абстрагирование скорее вредно, чем полезно. За нагромождением новых сущностей можно потерять суть и тратить больше времени на понимание происходящего. Построение абстракции — всегда компромисс. Слишком низкий уровень абстракции приводит к дублированию кода, слишком высокий — может быть очень трудным для понимания (Попробуйте понять Теорию Категорий) и усложняющим решение простых задач.

Huge Java Call Stack

Функции высшего порядка выводят абстрагирование с помощью функций на новый уровень. Благодаря делегированию поведения внешнему коду (используя анонимные функции), резко расширяется возможность повторного использования кода (алгоритма) в разных ситуациях. И вместо десяти функций для десяти разных участков кода появляется одна функция, которая специфицируется 10 раз разным поведением.

Но не забывайте, что абстракции почти всегда текут.

Пример дырявой абстракции

В первом проекте Хекслета наши ученики совершают одну (совершают много, но сейчас нас интересует одна) ошибку, связанную с неверным выделением абстракций. Если отбросить детали (абстрагироваться!), то задача сводится к написанию функции, которая принимает на вход число, и должна напечатать на экран yes, если оно чётное, и no в обратном случае.

Первое решение выглядит примерно так:

const check = (number) => {
  const result = number % 2 === 0 ? 'yes' : 'no';
  console.log(result);
};

Оно рабочее, но сама концепция чётности не выделена в свою абстракцию, что, например, затрудняет тестирование и понимание кода. Здесь он простой, но в более сложных случаях догадаться, что за операция выполняется — проблематично. Правильно было бы выделить чётность в отдельную функцию (абстракцию).

const isEven = (number) => (number % 2 === 0) ? 'yes' : 'no';

const check = (number) => {
  const result = isEven(number);
  console.log(result);
};

Посмотрите на код выше внимательно. Всё ли с ним нормально?

На самом деле, этот код даже хуже, чем первая версия, потому что создана неверная абстракция. Понятие чётности числа никак не связано ни с выводом на экран, ни со строчками yes или no. Оно существует в вакууме как математическая концепция и не может знать о том, как её собираются использовать. Не говоря уже про то, что имя isEven() начинается с is, а это значит, что функция — предикат. Такие функции могут возвращать только логическое значение и никак иначе (исключений не существует!). Правильный вариант выглядит так:

const isEven = (number) => (number % 2 === 0);
const check = (number) => {
  const result = isEven(number) ? 'yes' : 'no';
  console.log(result);
};

И это самый примитивный вариант создания абстракций. В реальном коде обычно всё значительно сложнее. Отработка построения правильных абстракций ведется в проектах Хекслета.


Дополнительные материалы

  1. Ментальное программирование 2

Аватары экспертов Хекслета

Остались вопросы? Задайте их в разделе «Обсуждение»

Вам ответят команда поддержки Хекслета или другие студенты.

Для полного доступа к курсу нужен базовый план

Базовый план откроет полный доступ ко всем курсам, упражнениям и урокам Хекслета, проектам и пожизненный доступ к теории пройденных уроков. Подписку можно отменить в любой момент.

Получить доступ
1000
упражнений
2000+
часов теории
3200
тестов

Открыть доступ

Курсы программирования для новичков и опытных разработчиков. Начните обучение бесплатно.

  • 130 курсов, 2000+ часов теории
  • 1000 практических заданий в браузере
  • 360 000 студентов
Отправляя форму, вы принимаете «Соглашение об обработке персональных данных» и соглашаетесь с «Условиями использования»

Наши выпускники работают в компаниях:

Логотип компании Альфа Банк
Логотип компании Aviasales
Логотип компании Yandex
Логотип компании Tinkoff
Рекомендуемые программы

С нуля до разработчика. Возвращаем деньги, если не удалось найти работу.

Иконка программы Фронтенд-разработчик
Профессия
с нуля
Разработка фронтенд-компонентов для веб-приложений
8 декабря 10 месяцев
Иконка программы Онлайн-буткемп. Фронтенд-разработчик
Профессия
Новый с нуля
Интенсивное обучение профессии в режиме полного дня
15 декабря 4 месяца
Иконка программы Node.js-разработчик
Профессия
с нуля
Разработка бэкенд-компонентов для веб-приложений
8 декабря 10 месяцев
Иконка программы Fullstack-разработчик
Профессия
с нуля
Разработка фронтенд- и бэкенд-компонентов для веб-приложений
8 декабря 16 месяцев

Используйте Хекслет по-максимуму!

  • Задавайте вопросы по уроку
  • Проверяйте знания в квизах
  • Проходите практику прямо в браузере
  • Отслеживайте свой прогресс

Зарегистрируйтесь или войдите в свой аккаунт

Отправляя форму, вы принимаете «Соглашение об обработке персональных данных» и соглашаетесь с «Условиями использования»