PassFront
  1. PassFront
  2. База знаний
  3. Функции

Чем отличаются стрелочные функции от обычных функций в JavaScript?

Функции

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

Отличия

  • this — стрелка не имеет своего this, берёт из внешнего лексического окружения; обычная функция получает this в момент вызова.
  • arguments — у стрелки нет объекта arguments; вместо него используют rest-параметр ...args.
  • new — стрелку нельзя вызвать с new, у неё нет prototype.
  • hoisting — стрелка обычно присваивается переменной (const fn = ...), поэтому не всплывает как Function Declaration.
const obj = {
  items: [1, 2, 3],
  double() {
    return this.items.map((x) => x * this.items.length);
    // стрелка внутри map сохраняет this метода
  },
};

Когда что использовать

  • Стрелки — колбэки, map/filter/reduce, обработчики внутри методов/классов, где нужно сохранить внешний this.
  • Обычные функции — методы объектов, конструкторы, места, где нужен динамический this или arguments.

Подводный камень

Не делайте метод объекта стрелкой, если внутри нужен this самого объекта:

const user = {
  name: 'Ann',
  greet: () => `Привет, ${this.name}`, // this НЕ user
};

Коротко для собеседования

Стрелка не имеет своего this, arguments, prototype и не работает с new — она берёт this из окружения. Удобна для колбэков; для методов и конструкторов нужны обычные функции.

Другие вопросы раздела