Каква е разликата между класическа функция и стрелкова функция в JavaScript?

Основната разлика е в начина, по който работят с this.

Класическата функция има собствен this, който се определя от контекста, в който е извикана (как е била извикана).

Стрелковата (arrow) функция няма собствен this. Тя наследява this лексикално от средата, в която е дефинирана.

Други разлики:

• Обект arguments: Класическите функции имат достъп до обекта arguments, стрелковите — не (но могат да се използват rest параметри).
• Конструктори: Класическите функции могат да се използват като конструктори с оператора new. Стрелковите — не.
• prototype свойство: Класическите функции имат свойството prototype. Стрелковите — не.

Пример за работа с this:

// Пример с класическа функция
const obj = {
  name: 'Обект',
  greet: function() {
    console.log(this.name); // this се отнася за obj
  }
};

obj.greet(); // Ще изведе: Обект

const greetFunc = obj.greet;
greetFunc(); // Ще изведе: undefined (или Window в браузъра) - this губи контекста

// Пример със стрелкова функция
const objArrow = {
  name: 'Обект със стрелка',
  greet: () => {
    console.log(this.name); // this наследява външния контекст (в този случай глобален или Window)
  }
};

objArrow.greet(); // Ще изведе: undefined (или името на прозореца в браузъра, ако name е дефинирано глобално)

const greetArrowFunc = objArrow.greet;
greetArrowFunc(); // Ще изведе: undefined (или името на прозореца в браузъра) - this не се променя