Czym się różnią funkcje strzałkowe od zwykłych funkcji?

Question

IT Interview Practice · Accepted Answer

Funkcje strzałkowe są krótsze, ale prawdziwe różnice dotyczą **zachowania wiązania**, a nie tylko składni.

```js
const regular = function () {};
const arrow = () => {};
const short = x => x * 2; // implicit return for one expression
```

## Kluczowe różnice

**1. Brak własnego `this`** — funkcje strzałkowe dziedziczą `this` z zakresu otaczającego. To jest najważniejsza różnica i dlatego świetnie się sprawdzają w callbackach:

```js
const timer = {
  seconds: 0,
  start() {
    setInterval(() => this.seconds++, 1000); // ✅ `this` is timer
    // a regular function here would have its own `this` (undefined) → bug
  },
};
```

**2. Brak obiektu `arguments`** — użyj parametrów rest zamiast tego:

```js
const sum = (...args) => args.reduce((a, b) => a + b, 0);
```

**3. Nie mogą być używane jako konstruktory** — `new arrow()` rzuca błąd i nie mają `prototype`.

## Kiedy NIE używać strzałek

```js
const obj = {
  name: "Ann",
  greet: () => `Hi ${this.name}`, // ❌ `this` is NOT obj (it's outer scope)
  greet2() { return `Hi ${this.name}`; }, // ✅ method needs dynamic `this`
};
```

Nie używaj strzałek dla **metod objektów** (nie będą wiązane do obiektu) lub gdy potrzebujesz dynamicznego `this`/`arguments` (obsługiwacze zdarzeń, które polegają na `this` będącym elementem).

## Dlaczego to ważne

Używaj strzałek dla callbacków i krótkich funkcji, gdzie dziedziczenie `this` jest tym, czego chcesz; użyj zwykłych funkcji dla metod, konstruktorów i metod prototypowych.

Kluczowe różnice

Kiedy NIE używać strzałek

Dlaczego to ważne

Powiązane pytania