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

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

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

Что такое функции и зачем они нам нужны?

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

Одна из основных причин использования функций — сделать наши программы на JavaScript модульными. Модульная программа — это программа, в которой функции составляют основную часть программы. Это будет иметь больше смысла, когда вы увидите несколько примеров.

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

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

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

Определение функций

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

function function-name(parameter list) {
 function-body;
 return statement;
}

Есть пара вещей, которые я должен сказать об этом шаблоне. Во-первых, список параметров — это набор данных, которые вы передаете функции. Одним из наиболее распространенных применений функции является преобразование данных из одного объекта в другой. Например, функция преобразования температуры, которая преобразует температуру Цельсия в температуру Фаренгейта, будет иметь температуру Цельсия в качестве параметра.

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

Наконец, у большинства функций есть оператор return. Здесь функция отправляет преобразованные данные обратно в программу.

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

На самом деле, давайте начнем с нескольких примеров без дальнейших церемоний. Поскольку я упомянул преобразование температуры Цельсия в градусы Фаренгейта, давайте начнем именно с этого примера. Во-первых, нам нужно знать формулу этого преобразования, а именно: (9,0 / 5,0) * температура по Цельсию + 32,0.

Теперь с помощью формулы мы можем написать определение функции:

function ctof(celsius) {
  let fahr = (9.0 / 5.0) * celsius + 32.0;
  return fahr;
}

Теперь давайте воспользуемся функцией в программе, которая просит пользователя ввести температуру в градусах Цельсия, с функцией преобразования температуры в градусы Фаренгейта. Вот полная программа:

function ctof(celsius) {
  let fahr = (9.0 / 5.0) * celsius + 32.0;
  return fahr;
}
putstr("Enter a Celsius temperature: ");
let celsius = parseInt(readline());
let fahr = ctof(celsius);
print(celsius,"Celsius equals",fahr, "Fahrenheit");

Вот результат двух запусков этой программы:

C:\js>js test.js
Enter a Celsius temperature: 100
100 Celsius equals 212 Fahrenheit
C:\js>js test.js
Enter a Celsius temperature: 0
0 Celsius equals 32 Fahrenheit

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

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

function square(number) {
  let squared = number * number;
  return squared;
}

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

Вот новое определение:

function square(number) {
  return number * number;
}

Вот программа, которая использует эту функцию:

function square(number) {
  return number * number;
}
putstr("Enter a number: ");
let num = parseInt(readline());
print(num,"squared is",square(num));

Вот результат нескольких запусков этой программы:

C:\js>js test.js
Enter a number: 2
2 squared is 4
C:\js>js test.js
Enter a number: 12
12 squared is 144
C:\js>js test.js
Enter a number: 2.25
2 squared is 4

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

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

function sum_of_squares(num1, num2) {
  return square(num1) + square(num2);
}

Вот короткая программа, использующая эту функцию:

putstr("Enter first number: ");
let num1 = parseFloat(readline());
putstr("Enter second number: ");
let num2 = parseFloat(readline());
let sumSquares = sum_of_squares(num1, num2);
print("Sum of squares of",num1,"and",num2,"is:",sumSquares);

Результат одного запуска этой программы:

C:\js>js test.js
Enter first number: 2
Enter second number: 3
Sum of squares of 2 and 3 is: 13

Функции с несколькими параметрами

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

d = √[(x2 − x1)2 + (y2 − y1)2]

Параметрами функции будут значения x и y для двух точек. Вот определение этой функции вместе с программой для ее проверки:

function distance(x1, y1, x2, y2) {
  let dx = x2-x1;
  let dy = y2-y1;
  let dsquared = dx * dx + dy * dy;
  return Math.sqrt(dsquared);
}
putstr("Enter x of first point: ");
let x1 = parseInt(readline());
putstr("Enter y of first point: ");
let y1 = parseInt(readline());
putstr("Enter x of second point: ");
let x2 = parseInt(readline());
putstr("Enter y of second point: ");
let y2 = parseInt(readline());
let dist = distance(x1, y1, x2, y2);
print("The distance is", dist);

Вот результат одного запуска этой программы:

Enter x of first point: 1
Enter y of first point: 2
Enter x of second point: 4
Enter y of second point: 3
The distance is 3.1622776601683795

Последние мысли

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

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

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

Больше контента на plainenglish.io. Подпишитесь на нашу бесплатную еженедельную рассылку новостей. Получите эксклюзивный доступ к возможностям написания и советам в нашем сообществе Discord.