Стрелочные vs обычные функции в JS: ключевые отличия

Стрелочные и обычные функции в JavaScript имеют ряд важных отличий.

Основные различия

  1. Наименование: Обычные функции могут иметь имя или быть анонимными. Стрелочные функции всегда анонимны.
  2. Поднятие (Hoisting): Именные обычные функции подвергаются поднятию (hoisting). Стрелочные функции не поддерживают поднятие. Присваивание стрелочной функции переменной, объявленной с помощью let или const (использование var не рекомендуется), не позволяет вызывать функцию до её объявления, так как let и const не допускают поднятия.
  3. Контекст (this): Обычные функции имеют собственный контекст (this). В стрелочных функциях this наследуется из окружающего лексического контекста. Это важно учитывать при обработке событий. Если стрелочная функция используется в качестве обработчика события, this обычно будет равен глобальному объекту window, что может препятствовать изменению свойств элемента. В таких случаях предпочтительнее использовать обычные функции.
  4. Доступ к arguments: Обычные функции имеют доступ к объекту arguments, содержащему массив переданных аргументов. Стрелочные функции не имеют доступа к arguments. Вместо этого используйте rest параметры (…args).
  5. Синтаксис: Стрелочные функции имеют более компактный синтаксис. Например, для функции с одним параметром можно опустить скобки.

Использование стрелочных функций

Стрелочные функции часто используются для:

  • Присваивания переменным: Объявление переменной const со стрелочной функцией предотвращает случайное переприсваивание.
  • Обратных вызовов (callback functions): Их лаконичность делает их удобными для обратных вызовов.
  • Немедленно вызываемых функций-выражений (IIFE): Хотя обычные функции также подходят.

Использование обычных функций

Обычные функции предпочтительнее, когда:

  • Необходимо поднятие функции.
  • Требуется собственный контекст (this) внутри функции.

Выбор между стрелочной и обычной функцией зависит от контекста задачи. Понимание их различий необходимо для написания эффективного кода на JavaScript.

Что будем искать? Например,программа