Урок 18 из 114 · 8 мин

Стрелочные функции

Запись () => {}, короткий return, функциональные выражения и функции как значения.

Короче

Бро
Функция — это тоже значение. Её можно положить в переменную. А для маленьких функций есть стрелка =>.

Оператор

=>

Стрелочная функция

Что это: const double = (x) => x * 2; — если после стрелки выражение, оно возвращается само, без return.
Зачем: Короткие функции, особенно для методов массивов.
Как: JavaScript
const double = (x) => x * 2; console.log(double(110));
Так это работает

Понятие

Тело в фигурных скобках

Длинная стрелочная функция

Что это: (a, b) => { … return …; } — с фигурными скобками return нужен явно.
Зачем: Когда в функции несколько строк.
Как: JavaScript
const total = (price, qty) => { const sum = price * qty; return sum; }; console.log(total(220, 3));
Так это работает

Понятие

Функция как значение

Функции можно передавать

Что это: Функцию можно сохранить в переменную, положить в массив и передать в другую функцию.
Зачем: Основа обработчиков событий и методов массивов.
Как: JavaScript
const greet = function (name) { return `Привет, ${name}!`; }; console.log(greet("Аня"));
Так это работает

Ника
Стрелка с фигурными скобками без return вернёт undefined — частая ловушка.

Ваш ход

Задание

Стрелкой

Перепиши vat и label стрелочными функциями: vat(price) возвращает Math.round(price * 0.2), label(item, price) — строку ` ${item}: ${price} ₽ `.

vat(220) → 44 — пока нет
Подпись с ₽ — пока нет
Использованы стрелочные функции — пока нет
Без слова function — пока нет

function vat(price) {
  return Math.round(price * 0.2);
}
function label(item, price) {
  return item + ": " + price;
}

function vat(price) {
  return Math.round(price * 0.2);
}
function label(item, price) {
  return item + ": " + price;
}

Результат обновляется при вводе

ПрактикаОбязательное задание

Ловушка

Выберите один ответ.

Что вернёт (() => { 5 })()?

Домашнее заданиеДля закрепления

Короткая