Бесплатный курс по JavaScript. Зарегистрируйтесь для отслеживания прогресса →

JavaScript: Параметры функций

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

// Принимает на вход параметр любого типа
console.log('я параметр');
// Принимает на вход два строковых параметра
// первый - что ищем, второй - на что меняем
'google'.replace('go', 'mo'); // 'moogle'
// Принимает на вход два числовых параметра
// первый - начальный индекс (включая), второй - конечный индекс (не включая)
'hexlet'.slice(1, 3); // 'ex'

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

// Передача параметров напрямую без переменных
getLastChar('Hexlet'); // 't'
// Передача параметров через переменные
const name1 = 'Hexlet';
getLastChar(name1); // 't'
const name2 = 'Goo';
getLastChar(name2); // 'o'

Из описания и примеров кода мы можем сделать следующие выводы:

  • Нам нужно определить функцию getLastChar()
  • Функция должна принимать на вход один параметр строкового типа
  • Функция должна возвращать значение строкового типа

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

const getLastChar = (str) => {
  // Вычисляем индекс последнего символа как длина строки - 1
  return str[str.length - 1];
}

Разберем его. В скобках указывается имя параметра (str). Так как внутри функции мы не знаем, с каким конкретно значением идет работа, то параметры всегда описываются как переменные. Имя параметра может быть любым, оно не связано с тем, как вызывается функция. Главное, чтобы это имя отражало смысл того значения, которое содержится внутри. Конкретное значение параметра будет зависеть от вызова этой функции.

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

// функция по нахождению среднего числа
const average = (a, b) => {
  return (a + b) / 2;
}

average(1, 5); // 3
average(1, 2); // 1.5

Задание

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

  1. Строка, которую нужно обрезать
  2. Число символов, которые нужно оставить
// Передаём текст напрямую
// Обрезаем текст, оставляя 2 символа
truncate('hexlet', 2); // "he..."

// Через переменную
const text = 'it works!';
// Обрезаем текст, оставляя 4 символа
const result = truncate(text, 4);
console.log(result); // => 'it w...'

Реализовать эту функцию можно различными способами, подскажем лишь один из них. Для решения этим способом вам понадобится взять подстроку из строки, переданной первым параметром в функцию. Используйте для этого метод slice(). Подумайте, исходя из задания, с какого индекса и по какой вам надо извлечь подстроку?

  'welcome'.slice(2, 5); // "lco"

С точки зрения проверочной системы не имеет значения, каким из способов будет реализована функция truncate() внутри, главное – чтобы она выполняла поставленную задачу

Упражнение не проходит проверку — что делать? 😶

Если вы зашли в тупик, то самое время задать вопрос в «Обсуждениях». Как правильно задать вопрос:

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

Тесты устроены таким образом, что они проверяют решение разными способами и на разных данных. Часто решение работает с одними входными данными, но не работает с другими. Чтобы разобраться с этим моментом, изучите вкладку «Тесты» и внимательно посмотрите на вывод ошибок, в котором есть подсказки.

Мой код отличается от решения учителя 🤔

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

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

Прочитал урок — ничего не понятно 🙄

Создавать обучающие материалы, понятные для всех без исключения, довольно сложно. Мы очень стараемся, но всегда есть что улучшать. Если вы встретили материал, который вам непонятен, опишите проблему в «Обсуждениях». Идеально, если вы сформулируете непонятные моменты в виде вопросов. Обычно нам нужно несколько дней для внесения правок.

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

Нашли ошибку? Есть что добавить? Пулреквесты приветствуются https://github.com/hexlet-basics
Если вы столкнулись с трудностями и не знаете, что делать, задайте вопрос в нашем большом и дружном сообществе