Зарегистрируйтесь для доступа к 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

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

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

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

Ошибки, сложный материал, вопросы >
Нашли опечатку или неточность?

Выделите текст, нажмите ctrl + enter и отправьте его нам. В течение нескольких дней мы исправим ошибку или улучшим формулировку.

Что-то не получается или материал кажется сложным?

Загляните в раздел «Обсуждение»:

  • задайте вопрос. Вы быстрее справитесь с трудностями и прокачаете навык постановки правильных вопросов, что пригодится и в учёбе, и в работе программистом;
  • расскажите о своих впечатлениях. Если курс слишком сложный, подробный отзыв поможет нам сделать его лучше;
  • изучите вопросы других учеников и ответы на них. Это база знаний, которой можно и нужно пользоваться.

Об обучении на Хекслете

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

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

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

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

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

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

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

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

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

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

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

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

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

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