Урок 27. Что такое функции в JavaScript

Все уроки по JavaScript расположены здесь.

Чтобы было проще понять, что такое функция в JS, давайте начнем с примера. К примеру, вот как выглядит последовательность шагов при вычислении площади прямоугольника:

1. Измерьте ширину прямоугольника.
2. Измерьте высоту прямоугольника.
3. Умножьте ширину на высоту прямоугольника.

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

const width = 10;
const height = 6;
const area =  width * height;
console.log(area); // Output: 60

А теперь представьте, что вас просят вычислить площадь трех разных прямоугольников:

// Площадь первого прямоугольника
const width1 = 10;
const height1 = 6;
const area1 =  width1 * height1;

// Площадь второго прямоугольника
const width2 = 4;
const height2 = 9;
const area2 =  width2 * height2;

// Площадь третьего прямоугольника
const width3 = 10;
const height3 = 10;
const area3 =  width3 * height3;

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

Взгляните на рисунок ниже.



Он в простом и наглядном виде показывает, что такое функция в JS. Функция (здесь она называется AddOneSide) представлена в виде черного ящика. В него с одной стороны входит треугольник, а с другой стороны выходит квадрат. Если на вход подать квадрат, то выйдет пятиугольник.

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