Jaka jest różnica między funkcjami strzałkowymi a zwykłymi funkcjami w JavaScript?

1. Składnia:
   • Funkcja zwykła: function myFunction() { ... }
   • Funkcja strzałkowa: () => { ... } lub param => { ... }
2. Kontekst this:
   • Funkcja zwykła: this jest określane przez kontekst wywołania.
   • Funkcja strzałkowa: this jest dziedziczone leksykalnie z otaczającego zakresu (nie ma własnego this).
3. Konstruktory:
   • Funkcja zwykła: Może być używana jako konstruktor (new myFunction()).
   • Funkcja strzałkowa: Nie może być używana jako konstruktor.
4. Obiekt arguments:
   • Funkcja zwykła: Ma własny obiekt arguments zawierający przekazane argumenty.
   • Funkcja strzałkowa: Nie ma własnego obiektu arguments, dostęp do argumentów odbywa się przez parametry rest (...args).
5. Funkcje nazwane:
   • Funkcja zwykła: Może mieć nazwę (function myFunction() { ... }).
   • Funkcja strzałkowa: Domyślnie anonimowa, przypisywana do zmiennej dla nadania nazwy (const myFunction = () => { ... }).
6. Return domyślny (niejawny):
   • Funkcja zwykła: Wymaga jawnego użycia return do zwrócenia wartości (z wyjątkiem prostych przypadków, jak IIFE).
   • Funkcja strzałkowa: Przy jednolinijkowym ciele może niejawnie zwracać wynik wyrażenia bez return.

Tabela porównawcza:

Cecha	Funkcja zwykła	Funkcja strzałkowa
Składnia	function name() { ... }	() => { ... }
Kontekst this	Dynamiczny (w zależności od wywołania)	Leksykalny (z zakresu nadrzędnego)
Konstruktor	Tak	Nie
Obiekt arguments	Tak	Nie (używa parametrów rest)
Nazewnictwo	Może być nazwane	Anonimowe (przypisane)
Niejawny zwrot	Nie (zazwyczaj wymaga return)	Tak (dla jednolinijkowego ciała)

// Przykład funkcji zwykłych
function standardFunction() {
  console.log(this); // Zależy od kontekstu wywołania
  console.log(arguments); // Obiekt arguments dostępny
}

const obj = {
  method: standardFunction
};

standardFunction(); // `this` będzie window (w przeglądarce) lub undefined (w trybie ścisłym)
obj.method(); // `this` będzie obj
new standardFunction(); // `this` będzie nową instancją

// Przykład funkcji strzałkowych
const arrowFunction = () => {
  console.log(this); // Dziedziczy `this` z otaczającego zakresu (np. globalny lub moduł)
  // console.log(arguments); // Błąd, `arguments` niedostępny
};

const outerObj = {
  outerMethod: function() {
    const innerArrowFunction = () => {
      console.log(this); // Dziedziczy `this` z outerMethod (które jest outerObj)
    };
    innerArrowFunction();
  }
};

arrowFunction(); // `this` będzie window (w przeglądarce) lub {} (w Node.js)
outerObj.outerMethod(); // `this` w innerArrowFunction będzie outerObj

// Niejawny zwrot w funkcji strzałkowej
const sum = (a, b) => a + b;
console.log(sum(2, 3)); // 5

// Funkcja zwykła z jawnym zwrotem
function multiply(a, b) {
  return a * b;
}
console.log(multiply(2, 3)); // 6

// Funkcja strzałkowa nie może być konstruktorem
// new arrowFunction(); // Błąd: TypeError: arrowFunction_1 nie jest konstruktorem