Математика для программиста

Спрашивает нас Антон: нужна ли математика программисту? Антон, нужна. А, кроме неё, нужна сферическая геометрия, география, музыка и банковское дело. И я сейчас не шучу.

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

Для решения чисто программистских задач у нас есть алгоритмы и паттерны: если посмотреть на код интернет-магазина цветов и банковского сайта он будет очень похож. Будут использоваться одинаковые условия, одинаковые циклы и даже паттерн MVC будет один и тот же.

Важнее то, что стоит за этими вещами: понимание как работает система в целом. Если посмотреть на вещи с этой стороны, то станет понятно, что программист — это младший специалист в области, в которой работает сайт.

Ещё пять лет назад Артём Поликарпов доказал, что каждый фронтендер немного дизайнер. Нам нужно понимать как устроены шрифты: что такое гротеск, чем он отличается от антиквы, что такое интерлиньяж, кернинг, разрядка, капитель. Понимать, что такое сетки и что такое композиция. Кроме этого, разбираться в UX — мы должны знать что такое оптимистичный UI, где поставить прелоадер и зачем это всё нужно пользователю.

Но быть только дизайнером — мало. Дело в том, что пользователи взаимодействуют с нашими сайтами: в интернет-магазинах они вводят данные своих банковских карт, на картографических сервисах прокладывают маршруты и измеряют расстояния, на музыкальных сайтах они транспонируют тональность песен и настраивают гитару по тюнеру. И всё это должен кто-то запрограммировать. Получается, что у программиста должны быть специальные знания.

Например, правильность номера банковской карты определяется по алгоритму Луна — это теория кодирования.

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

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

Кстати, о трансформациях. Помните CSS-фильтр matrix? Те самые числа в странном порядке, которые непонятно как влияют на поведение вашего блока? Это матрицы перехода из линейной алгебры. Если разобраться что такое матрицы и как перемножать их между собой, то вы сможете очень эффективно писать трансформации не пользуясь алиасами.

.neo {
  transform: matrix(0, -1, 1, 0, 50px, 50px);
}

С кругозором понятно — изучайте всё, что хотите, потому что в любом случае это вам пригодится. Но есть ли какая-то общая область, которая нужна всем программистам? Да, такая область есть, она называется «дискретная математика». Наука, которая лежит в основе информатики.

Я не говорю, что нужно учить диксретку досконально. Для программиста важнее широта взглядов и понимание, где посмотреть, чем узкие знания в какой-то отдельной области. Но помнить несколько основных тем не помешает.

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

Ещё одна хорошая тема из дискретки — это графы. Очень многие программистские задачи решаются с помощью графов. Даже скучный и привычный DOM — это дерево, частный случай графа. И здесь неплохо бы понимать хотя бы как по деревьям можно ходить.

Например, вы знаете, что querySelector использует поиск в глубину? Это значит, что когда он заходит на узел DOM-дерева, он пытается посмотреть сначала его дочерние узлы и только потом соседние. Это значит если вы будете искать с помощью querySelector первый элемент на странице, то необязательно это будет элемент верхнего уровня, найденный элемент может находиться на любой вложенности.

<main>
  <section>
    <div id="underdog"></div>
  </section>
  <div id="favorite"></div>
</main>

const firstDiv = document.querySelector('div');
firstDiv.id === 'underdog';

Ещё одна тема из дискретной математики — алгоритмы. Теория алгоритмов изучает что такое алгоритмы и оценку их эффективности. Представьте, у вас есть список людей, у которых вам нужно посчитать средний рост. Список задан в виде массива объектов.

const people = [
  { name: 'Иван', height: 183 },
  { name: 'Марья', height: 155 },
];

Первое решение, которое может прийти в голову — это с помощью метода map собрать другой массив, массив ростов этих людей, а потом с помощью метода reduce посчитать их сумму и поделить на количество.

const averageHeight = people
  .map(it => it.height)
  .reduce((acc, it) => acc + it) / people.length;

Но это решение будет неэффективным, потому что вы будете использовать два прохода по массиву, вместо одного. Вы могли бы сразу использовать reduce для того, чтобы сложить сразу все показатели по росту.

const averageHeight = people
  .reduce((acc, it) => acc + it.height) / people.length;

На деле оценка эффективности алгоритмов это немного более сложная тема, она учитывает и какой алгоритм вы используете и объём входных данных, но направление мысли вы поняли. Умение оценить эффективность алгоритмов поможет вам писать код, который будет хорошо работать или на старых телефонах и компьютерах или который не будет тормозить при работе со сложными алгоритмами, например, с большими визуализациями.

Итого: учите всё подряд, что попадётся вам под руку. Для начала изучите дискретку, потому что она будет вашим основным инструментом в работе, а потом сосредоточьтесь на задачах вашего бизнеса и вы откроете для себя очень много нового в бизнесе, математике, строительстве и медицине.

«Доктайп» — журнал о фронтенде. Читайте, слушайте и учитесь с нами.