Работа с функциями

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

2.1. Что такое функция?

Функция — это блок кода, который выполняет определённое действие или вычисление. Функции помогают:

🔄 Повторно использовать код, избегая дублирования.
📦 Инкапсулировать логику для удобства и читаемости.
🛠️ Разбивать задачи на более мелкие, легко управляемые части.

Пример функции

function greet() {
  console.log('Привет, мир!');
}

// Вызов функции
greet(); // Привет, мир!

2.2. Как создавать функции

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

Обычные функции (Function Declaration)

function greet(name) {
  return `Привет, ${name}!`;
}
console.log(greet('Анна')); // Привет, Анна!

Ключевые особенности:

Объявляются с помощью ключевого слова function.
Имеют имя.
Доступны во всём блоке, где были объявлены, благодаря всплытию (hoisting).

💡 Совет

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

Функциональные выражения (Function Expression)

Функция может быть присвоена переменной:

const greet = function(name) {
  return `Привет, ${name}!`;
};
console.log(greet('Анна')); // Привет, Анна!

Ключевые особенности:

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

Стрелочные функции (Arrow Functions)

Стрелочные функции — это современный и сокращённый синтаксис для функций:

const greet = (name) => `Привет, ${name}!`;
console.log(greet('Анна')); // Привет, Анна!

Особенности:

Упрощённый синтаксис.
Нет собственного this и arguments.
Идеальны для использования в обработчиках событий, методах массивов (map, filter, reduce).

💡 Совет

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

2.3. Аргументы функций

Аргументы — это входные данные, которые передаются в функцию при её вызове.

Как задавать аргументы?

В скобках после имени функции перечисляются параметры, которые ожидаются:

function greet(name) {
  console.log(`Привет, ${name}!`);
}
greet('Анна'); // Привет, Анна!

Параметры по умолчанию

Если аргумент не передан, можно задать значение по умолчанию:

function greet(name = 'Гость') {
  console.log(`Привет, ${name}!`);
}
greet(); // Привет, Гость!

💡 Совет

Используйте значения по умолчанию, чтобы избежать ошибок с undefined аргументами.

2.4. Возвращаемые значения

Функция может вернуть результат своей работы с помощью оператора return:

function add(a, b) {
  return a + b;
}
console.log(add(3, 5)); // 8

Если в функции нет return, она возвращает undefined.
Функции могут возвращать объекты, массивы, другие функции:

function createUser(name, age) {
  return { name, age };
}
console.log(createUser('Анна', 25)); // { name: 'Анна', age: 25 }

2.5. Замыкания

Замыкание — это функция, которая «запоминает» переменные из своего внешнего окружения:

function createCounter() {
  let count = 0;
  return function() {
    count++;
    return count;
  };
}
const counter = createCounter();
console.log(counter()); // 1
console.log(counter()); // 2

Полезно для создания счётчиков, генераторов уникальных значений, инкапсуляции данных.

💡 Совет

Используйте замыкания для защиты данных от изменения извне.

2.6. Callback-функции

Callback-функция — это функция, передаваемая как аргумент в другую функцию, для выполнения после завершения какой-либо операции.

Пример

function processInput(callback) {
  const name = prompt('Введите ваше имя:');
  callback(name);
}
processInput((name) => {
  alert(`Привет, ${name}!`);
});

💡 Совет

Callback'и полезны для асинхронных операций, например, обработки событий или работы с API.