Ответ
Основные различия между стрелочными (=>) и обычными (function) функциями в JavaScript:
| Аспект | Обычная функция (function) |
Стрелочная функция (=>) |
|---|---|---|
Контекст this |
Динамический. Определяется в момент вызова (кто вызвал). | Лексический. Берется из окружающей области видимости (где объявлена). |
Объект arguments |
Доступен внутри функции. | Не определен. Используется rest-оператор (...args). |
| Использование как конструктор | Можно использовать с new. |
Нельзя, вызовет ошибку (TypeError). |
Свойство prototype |
Присутствует. | Отсутствует. |
| Синтаксис | Более многословный. | Лаконичный для простых выражений (неявный возврат). |
Практические примеры:
-
Поведение
this(критично для обработчиков событий и методов объектов):const obj = { value: 'test', regularFunc: function() { console.log(this.value); }, // 'test' arrowFunc: () => { console.log(this.value); } // undefined (берет this из внешней области) }; obj.regularFunc(); // Контекст - obj obj.arrowFunc(); // Контекст - глобальный объект (или модуль) -
Отсутствие
argumentsв стрелочных функциях:function regularSum() { let sum = 0; for (let arg of arguments) { sum += arg; } // arguments работает return sum; } const arrowSum = (...args) => { // Используем rest-параметры return args.reduce((a, b) => a + b, 0); };
Вывод: Стрелочные функции отлично подходят для колбэков и коротких операций, где нужно сохранить лексический this. Обычные функции необходимы для методов объектов, конструкторов и случаев, где требуется доступ к arguments или динамический this.
Ответ 18+ 🔞
Давай разберём, в чём тут собака зарыта между обычными функциями и этими стрелочными засранцами. Ситуация, в общем, как с машиной: одна — старая добрая "Волга", вторая — новомодная тачка с кучей электроники. И та, и другая едут, но ведут себя нихуя по-разному.
Ну смотри, вот тебе разбор полётов:
| Что сравниваем | Обычная функция (function) |
Стрелочная функция (=>) |
|---|---|---|
Этот ваш this |
Живёт своей жизнью, ёпта. Кто её позвал — тот и папа. Контекст плавает, как говно в проруби. | Умная жопа. Берёт this оттуда, где её написали, и никуда не дёргается. Лексический, блядь. |
Объект arguments |
Есть, родной. Заходи — бери. | Нету нихуя. Совсем. Если надо аргументы — используй ...args, и не выёбывайся. |
Можно ли сделать new |
Да, конечно. Конструктор, ёбана. | Ни в коем случае! Попробуешь — получишь TypeError прямо в ебальник. |
Свойство prototype |
Присутствует, как совесть у политика. Ну, в теории. | Отсутствует, как мозги у того, кто пытается через неё new вызвать. |
| Как выглядит | Много букв, всё чинно-благородно. | Коротко и ясно, если выражение простое — можно даже без return и фигурных скобок. |
А теперь на живых примерах, чтобы волнение ебать отпало:
-
Про
this, или почему всё сломалось в пятницу вечером Самый частый подводный камень, об который все бьются. Смотри:const obj = { value: 'test', regularFunc: function() { console.log(this.value); }, // Выведет 'test'. Всё логично: функция вызвана как метод obj. arrowFunc: () => { console.log(this.value); } // Выведет undefined. Ёпта, а где this? А он смотрит наружу, на глобальную область! }; obj.regularFunc(); // Всё ок. obj.arrowFunc(); // А тут — пиздец и пустота.Запомни: стрелочную функцию нельзя использовать для методов объекта, если тебе нужен
thisсамого объекта. Она тупо его не увидит, упырь такая. -
Про
arguments, или куда делись все параметры Раньше жили спокойно, а теперь — нет:function regularSum() { let sum = 0; // Спокойно идём по псевдомассиву arguments, как по проспекту. for (let arg of arguments) { sum += arg; } return sum; } const arrowSum = (...args) => { // Видишь троеточие? Это наш новый друг, rest-параметр. Он собирает всё в нормальный массив. return args.reduce((a, b) => a + b, 0); // И с ним уже можно работать адекватно. };В стрелочной функции
arguments— этоundefined. Не ищи — не найдёшь. Привыкай к синтаксису....
Итог, блядь:
Стрелочные функции — это охуенно для коротких действий, колбэков в setTimeout или map, где надо, чтобы this не сбежал. Они лаконичные и предсказуемые.
Но если тебе нужен метод объекта, конструктор или магия с arguments — бери старую добрую function. Не пытайся всё делать одной отвёрткой, пидарас шерстяной. Для каждой задачи — свой инструмент, и тогда будет тебе хиросима, а не нигерсраки в коде.