⚡ JavaScript

Лямбда-функции и функциональный стиль в JavaScript (Node.js): подробное руководство

Урок 23 / 35 • Полная теория для чтения

Что это такое и зачем? (аналогия из реальной жизни)

Представьте, что вы пришли в автомастерскую. У мастера есть огромный ящик с инструментами: гаечные ключи, отвёртки, молотки. Каждый инструмент — это функция. Вы просите мастера: «Подкрути колесо». Мастер берёт ключ и делает работу.

А теперь представьте, что вы говорите мастеру: «Вот тебе инструкция, как сделать новый инструмент прямо сейчас, и сразу используй его». Вы не берёте готовый инструмент из ящика — вы описываете действие на месте и тут же его выполняете. Вот это и есть лямбда-функция (или стрелочная функция, как её называют в JavaScript).

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

Важно: Лямбда-функции — это не магия, а просто способ писать функции короче и удобнее. Они делают код более «функциональным», то есть таким, где функции можно передавать другим функциям как обычные значения (числа, строки).

Зачем это нужно? Представьте, что вы пишете код для обработки списка покупок. Вам нужно найти все продукты дороже 100 рублей. Вместо того чтобы писать целый цикл с условием, вы можете сказать: «Возьми список и отфильтруй его по правилу: цена больше 100». Это правило и есть лямбда-функция. Код становится короче, понятнее, и в нём меньше шансов ошибиться.

Функциональный стиль — это подход, при котором мы комбинируем функции как детали конструктора. Мы не пишем длинные инструкции «сделай шаг 1, потом шаг 2, потом шаг 3». Вместо этого мы говорим: «Возьми данные, примени к ним функцию А, результат передай в функцию Б, а потом в функцию В». Это похоже на конвейер на заводе: на входе — сырьё, на выходе — готовое изделие.

Теория: как это работает изнутри

Давайте заглянем «под капот» JavaScript и поймём, как устроены лямбда-функции.

В JavaScript функции — это объекты первого класса. Что это значит? Это значит, что с функцией можно делать всё то же самое, что и с числом или строкой:

Записать в переменную
Передать в другую функцию как аргумент
Вернуть из другой функции как результат
Положить в массив или объект

Лямбда-функция (стрелочная функция) — это просто более короткий синтаксис для создания такой функции. Но есть одно важное отличие от обычной функции: у неё нет своего this.

Ключевой момент: this внутри стрелочной функции берётся из внешнего окружения (из той функции, внутри которой она создана). Обычная функция создаёт свой собственный this. Это сделано специально, чтобы избежать путаницы в обработчиках событий и колбэках.

Как JavaScript выполняет лямбда-функцию? Когда движок (например, V8 в Node.js) встречает стрелочную функцию, он:

Создаёт объект функции (как и для обычной функции).
Запоминает лексическое окружение (все переменные, которые доступны в месте создания функции).
Не создаёт свой контекст this (в отличие от обычной функции).
Если тело функции состоит из одного выражения — возвращает его результат автоматически, без слова return.

Вот как это выглядит в памяти (упрощённо):

// Обычная функция
function sum(a, b) {
  return a + b;
}

// Лямбда-функция (стрелочная)
const sum = (a, b) => a + b;

// Разница: в лямбде нет слова function, нет return (он подразумевается),
// и фигурные скобки не нужны, если тело — одно выражение.

Когда вы пишете const sum = (a, b) => a + b, JavaScript делает следующее:

Создаёт переменную sum в текущей области видимости.
Создаёт анонимную (безымянную) функцию с параметрами a и b.
Тело функции — выражение a + b. Результат этого выражения автоматически возвращается.
Присваивает эту функцию переменной sum.

Теперь sum — это функция, и её можно вызвать: sum(2, 3) вернёт 5.

Синтаксис в JavaScript (Node.js): все формы и варианты

У стрелочных функций есть несколько форм записи. Давайте разберём их все.

1. Базовая форма: один параметр, одно выражение

// Если параметр один — скобки можно опустить
const double = x => x * 2;

console.log(double(5)); // 10

2. Несколько параметров

// Если параметров несколько — скобки обязательны
const multiply = (a, b) => a * b;

console.log(multiply(3, 4)); // 12

3. Нет параметров

// Если параметров нет — нужны пустые скобки
const sayHello = () => 'Привет!';

console.log(sayHello()); // Привет!

4. Тело с несколькими инструкциями

// Если нужно выполнить несколько действий — используем фигурные скобки
// и явно пишем return
const processNumber = (x) => {
  const doubled = x * 2;
  const message = `Результат: ${doubled}`;
  return message;
};

console.log(processNumber(7)); // Результат: 14

5. Возврат объекта

// Чтобы вернуть объект, нужно обернуть его в круглые скобки
const createUser = (name, age) => ({ name: name, age: age });

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

// Без скобок JavaScript подумает, что фигурные скобки — это тело функции
// const createUser = (name, age) => { name: name, age: age }; // ОШИБКА!

6. Стрелочная функция как колбэк (передаётся в другую функцию)

const numbers = [1, 2, 3, 4, 5];

// Передаём лямбду в метод map
const doubled = numbers.map(n => n * 2);

console.log(doubled); // [2, 4, 6, 8, 10]

7. Стрелочная функция с деструктуризацией параметров

// Можно сразу «разобрать» объект на части
const users = [
  { name: 'Иван', age: 30 },
  { name: 'Мария', age: 25 }
];

// Деструктуризируем параметр { name, age }
const names = users.map(({ name, age }) => `${name} (${age} лет)`);

console.log(names); // ['Иван (30 лет)', 'Мария (25 лет)']

Вот таблица всех вариантов для быстрого справочника:

Ситуация	Синтаксис	Пример
Один параметр, одно выражение	`param => выражение`	`x => x * 2`
Несколько параметров	`(p1, p2) => выражение`	`(a, b) => a + b`
Нет параметров	`() => выражение`	`() => 42`
Несколько инструкций	`() => { инструкции; return результат; }`	`() => { let x = 5; return x * 2; }`
Возврат объекта	`() => ({ ключ: значение })`	`() => ({ name: 'Анна' })`
Деструктуризация параметра	`({ ключ }) => выражение`	`({ name }) => name`

Примеры кода — от простого к сложному

Давайте посмотрим на живые примеры. Каждый пример — это рабочий код для Node.js. Запускайте его и смотрите, что получается.

Пример 1: Простейшая лямбда

// Самая простая лямбда: принимает число и возвращает его квадрат
const square = x => x * x;

// Вызываем функцию
console.log(square(4)); // 16

// Объяснение:
// 1. const square — создаём переменную, в которую запишем функцию
// 2. x — параметр (входное значение)
// 3. => — стрелка, отделяет параметры от тела
// 4. x * x — тело функции, результат автоматически возвращается

Пример 2: Фильтрация массива

// У нас есть массив чисел. Нужно оставить только чётные.
const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];

// Метод filter принимает функцию-проверку (предикат)
// Если функция возвращает true — элемент остаётся, false — уходит
const evenNumbers = numbers.filter(n => n % 2 === 0);

console.log(evenNumbers); // [2, 4, 6, 8, 10]

// Объяснение:
// n => n % 2 === 0 — это лямбда, которая проверяет чётность
// n % 2 — остаток от деления на 2
// === 0 — сравниваем с нулём (если остаток 0 — число чётное)

Пример 3: Трансформация массива (map)

// У нас есть массив имён. Нужно сделать их заглавными.
const names = ['анна', 'иван', 'мария', 'петр'];

// Метод map применяет функцию к каждому элементу и возвращает новый массив
const capitalized = names.map(name => name[0].toUpperCase() + name.slice(1));

console.log(capitalized); // ['Анна', 'Иван', 'Мария', 'Петр']

// Объяснение:
// name[0] — первая буква
// .toUpperCase() — делает её заглавной
// name.slice(1) — остальная часть строки (с первого индекса до конца)
// Складываем: заглавная буква + остаток

Пример 4: Сортировка с лямбдой

// Сортируем массив объектов по возрасту
const people = [
  { name: 'Иван', age: 30 },
  { name: 'Анна', age: 25 },
  { name: 'Петр', age: 35 },
  { name: 'Мария', age: 28 }
];

// Метод sort принимает функцию сравнения
// Если функция возвращает отрицательное число — a идёт перед b
// Если положительное — b идёт перед a
// Если 0 — порядок не меняется
people.sort((a, b) => a.age - b.age);

console.log(people);
// [
//   { name: 'Анна', age: 25 },
//   { name: 'Мария', age: 28 },
//   { name: 'Иван', age: 30 },
//   { name: 'Петр', age: 35 }
// ]

// Объяснение:
// (a, b) => a.age - b.age — сравниваем возраст
// Если a.age меньше b.age — результат отрицательный, a будет раньше
// Так мы сортируем по возрастанию возраста

Пример 5: Цепочка методов (функциональный стиль)

// Классический пример функционального программирования:
// Берём массив, фильтруем, преобразуем, суммируем
const transactions = [
  { amount: 100, type: 'income' },
  { amount: 50, type: 'expense' },
  { amount: 200, type: 'income' },
  { amount: 30, type: 'expense' },
  { amount: 150, type: 'income' }
];

// Хотим: найти сумму всех доходов (income)
const totalIncome = transactions
  .filter(t => t.type === 'income')     // Оставляем только доходы
  .map(t => t.amount)                   // Берём только суммы
  .reduce((sum, amount) => sum + amount, 0); // Складываем всё

console.log(totalIncome); // 450 (100 + 200 + 150)

// Объяснение:
// .filter(t => t.type === 'income') — лямбда проверяет тип
// .map(t => t.amount) — лямбда извлекает сумму
// .reduce((sum, amount) => sum + amount, 0) — лямбда складывает
// Начальное значение суммы — 0
// Каждый раз: sum = sum + amount

Пример 6: Замыкание с лямбдой

// Лямбда «запоминает» переменные из внешней функции
function createMultiplier(factor) {
  // Возвращаем лямбду, которая «помнит» factor
  return x => x * factor;
}

// Создаём две разные функции
const double = createMultiplier(2);
const triple = createMultiplier(3);

console.log(double(5)); // 10 (5 * 2)
console.log(triple(5)); // 15 (5 * 3)

// Объяснение:
// createMultiplier(2) возвращает функцию x => x * 2
// Эта функция «замкнула» (запомнила) переменную factor = 2
// Даже после того, как createMultiplier завершила работу,
// возвращённая лямбда всё ещё помнит factor

Пример 7: Обработка ошибок в функциональном стиле

// Функция, которая может вернуть ошибку
function divide(a, b) {
  if (b === 0) {
    return { success: false, error: 'Деление на ноль!' };
  }
  return { success: true, value: a / b };
}

// Функция для безопасной обработки результата
function safeProcess(result, onSuccess, onError) {
  // onSuccess и onError — это лямбды, которые мы передаём
  if (result.success) {
    return onSuccess(result.value);
  } else {
    return onError(result.error);
  }
}

// Используем
const result1 = divide(10, 2);
const result2 = divide(10, 0);

// Передаём лямбды прямо в вызов
safeProcess(result1, 
  value => `Результат: ${value}`,           // onSuccess
  error => `Ошибка: ${error}`               // onError
); // 'Результат: 5'

safeProcess(result2,
  value => `Результат: ${value}`,
  error => `Ошибка: ${error}`
); // 'Ошибка: Деление на ноль!'

// Объяснение:
// Мы передаём функции как аргументы (колбэки)
// Это основа функционального стиля — функции как значения
// Лямбды делают код коротким и читаемым

Сравнение с Python: чем похоже и чем отличается

В Python тоже есть лямбда-функции. Они называются lambda. Давайте сравним.

Характеристика	JavaScript (стрелочная функция)	Python (lambda)
Синтаксис	`(x) => x * 2`	`lambda x: x * 2`
Ключевое слово	`=>` (стрелка)	`lambda`
Несколько выражений	Можно: `() => { let a = 1; return a; }`	Нельзя: только одно выражение
Автоматический return	Да (если без фигурных скобок)	Да (всегда)
Свой this/self	Нет (берёт из внешней функции)	Нет (использует внешнюю область видимости)
Использование	Очень часто (колбэки, методы массивов)	Часто (sorted, filter, map)
Многострочность	Поддерживается	Не поддерживается (только одна строка)

Вот примеры на Python для сравнения:

// JavaScript
const numbers = [1, 2, 3, 4, 5];
const doubled = numbers.map(n => n * 2);
console.log(doubled); // [2, 4, 6, 8, 10]

# Python
numbers = [1, 2, 3, 4, 5]
doubled = list(map(lambda n: n * 2, numbers))
print(doubled)  # [2, 4, 6, 8, 10]

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

Ещё одно отличие: в Python нет аналога this (есть self, но это совсем другое). В JavaScript this — частая причина ошибок, и стрелочные функции помогают их избежать.

Типичные ошибки и подводные камни

Даже опытные программисты иногда попадаются на этих граблях. Давайте разберём самые частые ошибки.

Ошибка 1: Забыли скобки при возврате объекта

// Неправильно:
const getPerson = () => { name: 'Иван', age: 30 };
console.log(getPerson()); // undefined

// Правильно:
const getPerson = () => ({ name: 'Иван', age: 30 });
console.log(getPerson()); // { name: 'Иван', age: 30 }

// Объяснение:
// В первом случае JavaScript думает, что { name: 'Иван', age: 30 } — это тело функции
// А name: — это метка (label), age: — ещё одна метка
// Функция ничего не возвращает (нет return), поэтому undefined
// Круглые скобки говорят: «Это не тело функции, а выражение-объект»

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

const obj = {
  name: 'Мой объект',
  // Неправильно: стрелочная функция берёт this из внешней области
  wrongMethod: () => {
    console.log(this.name); // undefined (this — глобальный объект)
  },
  // Правильно: обычная функция создаёт свой this
  correctMethod() {
    console.log(this.name); // 'Мой объект'
  }
};

obj.wrongMethod();  // undefined
obj.correctMethod(); // 'Мой объект'

// Объяснение:
// Стрелочные функции не имеют своего this
// Они берут this из того места, где были созданы
// Вне метода obj — это глобальный объект (global в Node.js или window в браузере)
// Обычная функция получает this от объекта, через который её вызвали

Ошибка 3: Забыли return в многострочной лямбде

// Неправильно:
const double = (x) => {
  x * 2; // Нет return!
};
console.log(double(5)); // undefined

// Правильно:
const double = (x) => {
  return x * 2;
};
console.log(double(5)); // 10

// Объяснение:
// Если есть фигурные скобки — автоматический return отключается
// Нужно писать return явно
// Без фигурных скобок return подразумевается автоматически

Ошибка 4: Путаница с параметрами по умолчанию

// Можно, но нужно быть внимательным:
const greet = (name = 'Гость') => `Привет, ${name}!`;

console.log(greet());        // Привет, Гость!
console.log(greet('Анна'));  // Привет, Анна!

// Ошибка: если параметр один и со значением по умолчанию — скобки нужны
// const greet = name = 'Гость' => ... // Синтаксическая ошибка!

Ошибка 5: Использование arguments в стрелочной функции

// В обычной функции есть псевдомассив arguments
function regular() {
  console.log(arguments[0]); // 1
}

// В стрелочной функции arguments нет!
const arrow = () => {
  console.log(arguments[0]); // ReferenceError: arguments is not defined
};

regular(1, 2, 3);
// arrow(1, 2, 3); // Ошибка!

// Решение: использовать rest-параметры
const arrowFixed = (...args) => {
  console.log(args[0]); // 1
};
arrowFixed(1, 2, 3); // 1

Ошибка 6: Стрелочная функция как конструктор

// Нельзя использовать с new!
const Person = (name) => {
  this.name = name;
};

// const ivan = new Person('Иван'); // TypeError: Person is not a constructor

// Правильно: использовать обычную функцию
function PersonRegular(name) {
  this.name = name;
}
const ivan = new PersonRegular('Иван');
console.log(ivan.name); // Иван

Лучшие практики и советы профессионалов

Как писать код, чтобы он был красивым, понятным и без ошибок? Вот что советуют опытные разработчики.

Совет 1: Используйте лямбды для коротких функций

Если функция помещается в одну строку — используйте стрелочную функцию. Если она длинная (больше 3-4 строк) — лучше использовать обычную функцию с именем.

// Хорошо: короткая лямбда
const isEven = n => n % 2 === 0;

// Тоже хорошо: длинная логика — обычная функция
function calculateDiscount(price, userType, itemsCount) {
  let discount = 0;
  if (userType === 'vip') discount += 0.1;
  if (itemsCount > 5) discount += 0.05;
  if (price > 1000) discount += 0.02;
  return price * (1 - discount);
}

Совет 2: Не злоупотребляйте вложенностью

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

// Плохо: трудно читать
const result = data
  .filter(item => item.active)
  .map(item => item.price)
  .filter(price => price > 100)
  .reduce((sum, price) => sum + price, 0);

// Лучше: дать имена шагам
const activeItems = data.filter(item => item.active);
const prices = activeItems.map(item => item.price);
const expensivePrices = prices.filter(price => price > 100);
const total = expensivePrices.reduce((sum, price) => sum + price, 0);

Совет 3: Используйте деструктуризацию для ясности

// Вместо:
users.map(user => user.name);

// Лучше:
users.map(({ name }) => name);

// Особенно полезно для объектов с несколькими полями:
users.filter(({ age }) => age > 18);

Совет 4: Избегайте побочных эффектов в лямбдах

Лямбда должна возвращать значение, а не изменять что-то снаружи. Это делает код предсказуемым.

// Плохо: побочный эффект (изменяет внешнюю переменную)
let total = 0;
numbers.forEach(n => { total += n; });

// Хорошо: чистая функция, возвращает результат
const sum = numbers.reduce((acc, n) => acc + n, 0);

Совет 5: Используйте стрелочные функции для колбэков

В методах массивов (map, filter, reduce, forEach) стрелочные функции — стандарт де-факто. Они короче и понятнее.

// Старый стиль (не используйте):
numbers.map(function(n) { return n * 2; });

// Современный стиль:
numbers.map(n => n * 2);

Совет 6: Не бойтесь именовать лямбды

Если лямбда используется больше одного раза — дайте ей имя.

// Вместо:
const result = data
  .filter(x => x > 0)
  .map(x => x * 2);

// Если логика сложная:
const isPositive = x => x > 0;
const double = x => x * 2;

const result = data
  .filter(isPositive)
  .map(double);

Вопросы для самопроверки

Проверьте, как вы усвоили материал. Ответы — под вопросами.

Что такое лямбда-функция (стрелочная функция) в JavaScript?

Ответ

Это сокращённый способ записи функции с использованием синтаксиса =>. Она отличается от обычной функции тем, что не имеет своего this, не может использоваться как конструктор, и если тело состоит из одного выражения — автоматически возвращает его результат.
В чём разница между function(a, b) { return a + b; } и (a, b) => a + b?

Ответ

Вторая запись короче. У неё нет слова function, нет return (он подразумевается), и нет фигурных скобок. Также у стрелочной функции нет своего this — она берёт его из внешней области видимости.
Как вернуть объект из стрелочной функции?

Ответ

Нужно обернуть объект в круглые скобки: () => ({ key: 'value' }). Иначе JavaScript подумает, что фигурные скобки — это тело функции.
Почему в стрелочной функции нет arguments?

Ответ

Потому что стрелочные функции не имеют своего объекта arguments. Вместо него нужно использовать rest-параметры: (...args) => { ... }.
Можно ли использовать стрелочную функцию с new?

Ответ

Нет. Стрелочные функции не могут быть конструкторами. При попытке вызвать new arrowFunc() будет ошибка TypeError.
Что выведет этот код: const obj = { fn: () => this }; console.log(obj.fn());

← Предыдущая Методы массивов и коллекций в JavaScript (Node.js) Вперёд → Дженерики и параметрические типы в JavaScript (Nod