Mi a különbség a klasszikus függvény és a nyíl függvény között JavaScriptben?

A fő különbség abban rejlik, hogyan működnek a this használatában.

Egy klasszikus függvény saját this-tel rendelkezik, amely a hívás kontextusától függ (hogyan hívták meg).

Egy arrow függvény nem rendelkezik saját this, hanem lexikálisan örökli this a definiálás környezetéből.

További különbségek:

• arguments objektum: A klasszikus függvények hozzáférnek az arguments objektumhoz, az arrow függvények nem (de használhatók rest paraméterek).
• Konstruktorok: A klasszikus függvények használhatók konstruktorként a new operátorral. Az arrow függvények nem.
• prototype tulajdonság: A klasszikus függvények rendelkeznek a prototype tulajdonsággal. Az arrow függvények nem.

Példa a this használatára:

// Klasszikus függvény példája
const obj = {
  name: 'Objektum',
  greet: function() {
    console.log(this.name); // this az obj-re utal
  }
};

obj.greet(); // Kiírja: Objektum

const greetFunc = obj.greet;
greetFunc(); // Kiírja: undefined (vagy Window a böngészőben) - a this elveszíti a kontextust

// Arrow függvény példája
const objArrow = {
  name: 'Arrow objektum',
  greet: () => {
    console.log(this.name); // this a külső kontextust örökli (ebben az esetben globális vagy Window)
  }
};

objArrow.greet(); // Kiírja: undefined (vagy a böngésző ablakának nevét, ha a name globálisan van definiálva)

const greetArrowFunc = objArrow.greet;
greetArrowFunc(); // Kiírja: undefined (vagy a böngésző ablakának nevét) - a this nem változik