6 Rozdíly mezi funkcemi šipek a regulárními funkcemi v JavaScriptu

Funkce jsou nezbytnou součástí JavaScriptu, kterou musíte použít k psaní opakovaně použitelného kódu. Dva hlavní typy funkcí jsou regulární a šipkové funkce a existuje mnoho způsobů, jak je definovat.

I když splňují podobné potřeby, mají několik zásadních rozdílů, které mohou zásadně ovlivnit, jak je použijete ve svém kódu. Naučte se vše o několika rozdílech mezi funkcemi šipek a běžnými funkcemi.

1. Rozdíly v syntaxi

Syntaxe, kterou zvolíte při vývoji funkcí JavaScriptu, má velký vliv na to, jak jednoduché je číst a porozumět vašemu kódu. Syntaxe regulárních funkcí a funkcí se šipkami se výrazně liší, což má vliv na to, jak je píšete a používáte.

Funkce šipek JavaScriptu používat menší jazykovou strukturu, která je srozumitelnější. Můžete je použít k vytvoření funkcí jejich zkombinováním do jediného výrazu nebo příkazu.

konst přidat = (a, b) => a + b;

V tomto příkladu je přidat funkce přijímá dva vstupy, A a ba vrátí jejich celkovou částku. The => znak to definuje jako funkci šipky.

Na druhou stranu, definování běžné funkce vyžaduje použití funkce klíčové slovo s podrobnější syntaxí, jak ukazuje tento příklad:

funkcepřidat(a, b) {
vrátit se a + b;
}

V tomto příkladu je funkce klíčové slovo definuje běžnou funkci, která také používá složené závorky a vrátit se prohlášení.

Regulární funkce jsou užitečnější pro složitou syntaxi vyžadující více příkazů nebo výrazů. Naproti tomu funkce šipek používají stručnější syntaxi, která může usnadnit čtení a pochopení vašeho kódu.

2. Rozdíly v rozsahu

Termín "rozsah" popisuje, jak jsou přístupné vnitřní proměnné a funkce funkce. V JavaScriptu definujete proměnné a funkce a přistupujete k nim v celém kódu pomocí škálování. Jejich odlišná rozsah může významně ovlivnit způsob, jakým píšete a používáte JavaScript šipka a běžné funkce.

V rozsahu, jak funkce šipek zpracovávají tento klíčové slovo se výrazně liší od toho, jak fungují běžné funkce. Regulární funkce definují tento samotná klíčová slova; proto se může měnit v závislosti na kontextu, ve kterém funkci vyvoláte.

Na druhou stranu, protože nespecifikují tento klíčové slovo, funkce šipek používají totéž tento jako statický rozsah, který je obklopuje.

Chcete-li vidět rozdíl, podívejte se na následující příklad. Řekněme, že máte a osoba objekt s a název vlastnost a metoda tzv sayName() která zaznamenává jméno osoby pomocí běžné funkce:

konst osoba = {
 název: 'John,'
 sayName: funkce() {
řídicí panel.log(tento.název);
 }
};
osoba.sayName(); // logs 'John'

Zde je běžná funkce sayName() metodou objektu person a objektu tento klíčové slovo uvnitř této funkce odkazuje na daný objekt osoby.

Zkusme nyní to samé s funkcí šipky:

konst osoba = {
 název: 'John',
 sayName: () => {
řídicí panel.log(tento.název);
 }
};
osoba.sayName(); // protokoly nejsou definovány

Protože funkce šipky použitá v sayName() metoda nedefinuje svou vlastní tento klíčové slovo, používá tento statického rozsahu, který jej obklopuje. V tomto případě se jedná o globální rozsah instance.

V důsledku toho, když zavoláte person.sayName(), dostaneš nedefinováno spíše než "John." To může významně ovlivnit způsob, jakým píšete a používáte funkce v kódu.

3. Příklady použití a doporučené postupy

Běžné funkce jsou vhodnější pro funkce, které vyžadují své vlastní tento klíčové slovo, jako jsou metody v objektu.

Funkce šipek jsou vhodnější Funkcionální programování a zpětná volání, která nevyžadují tento klíčové slovo.

4. Rozdíly ve vazbě funkcí

Funkce vazba je termín používaný k popisu vztahu mezi tento klíčové slovo a funkce ve vašem kódu. Rozdíly ve vazbě funkcí mezi funkcemi šipek a normálními funkcemi mohou silně ovlivnit způsob, jakým konstruujete a používáte funkce šipek.

Za použití tento Klíčové slovo jej činí jedinečným v běžných funkcích a spojuje se s různými objekty na základě metody použité k volání funkce. Vazba funkcí je jedním z nejdůležitějších rozdílů mezi regulárními funkcemi a funkcemi se šipkami.

Naproti tomu funkce šipky nemají tento klíčové slovo; spíše to získávají z okolních oborů.

Podívejme se na příklad, abychom tomuto rozdílu více porozuměli. Předpokládejme, že máte a osoba objekt s a název pole a metoda tzv sayName() která používá běžnou funkci k záznamu jména osoby:

konst osoba = {
 název: 'John',
 sayName: funkce() {
řídicí panel.log(tento.název);
 }
};
konst další osoba = {
 název: 'Jane'
};
osoba.sayName.call (jiná osoba); // logs 'Jane'

V tomto příkladu nazýváte objekt osoby sayName() metoda s hodnotou další člověk za použití volání() metoda. Z tohoto důvodu, sayName() metoda, tento, klíčové slovo je vázáno na další člověk objekt a zaznamená se "Jane" spíše než "John."

Nyní použijeme totéž s funkcí šipky:

konst osoba = {
 název: 'John',
 sayName: () => {
řídicí panel.log(tento.název);
 }
};
konst další osoba = {
 název: 'Jane'
};
osoba.sayName.call (jiná osoba); // protokoly nejsou definovány

Vzhledem k tomu, sayName() technika nemá své vlastní klíčové slovo, v tomto příkladu v něm používáte funkci šipky. V tomto případě funkce šipky zdědí vlastnosti okolního rozsahu, což je globální rozsah.

To znamená, že když běžíte person.sayName.call (jiná osoba), funkce šipky tento klíčové slovo zůstává globálním objektem a nedefinováno zaujímá místo Jane v logu.

Pokud potřebujete svázat funkci s konkrétním tento hodnotu, může být vhodnější běžná funkce. Pokud však nepotřebujete vázat funkci na konkrétní tento hodnota, může být funkce šipky kratší a snáze srozumitelná.

5. Implicitní návratnost

Funkce šipky má implicitní funkci návratu. Pokud se tělo funkce skládá z jednoho jediného výrazu, funkce vrátí tento výraz.

Jako příklad:

konst dvojitý = (X) => X * 2;

Tato funkce šipky vrací dvojnásobek z parametru. Nemusíte používat explicitní vrátit se klíčové slovo, protože tělo funkce má pouze jeden výraz.

6. Rozdíly v kompatibilitě

Rozdíly v kompatibilitě se týkají přidaných funkcí šipek ECMAScript 6, které nemusí fungovat se staršími prohlížeči nebo prostředími. Na druhou stranu běžné funkce existují již od počátku JavaScriptu a jsou široce podporovány.

Zde je ilustrace funkce šipky, která nemusí fungovat v ustálenějších podmínkách:

konst přidat = (a, b) => a + b;

Následuje srovnatelná běžná funkce, která by měla fungovat ve většině situací:

funkcepřidat(a, b) {
vrátit se a + b;
}

Při cílení na starší prostředí používejte běžné funkce, nikoli funkce šipek, abyste zajistili kompatibilitu. Funkce šipek však mohou poskytnout syntaxi, která je při práci s moderními prohlížeči a prostředími srozumitelnější a zhuštěnější.

Výběr mezi funkcemi šipek a regulárními funkcemi v JavaScriptu

V JavaScriptu mají šipky a běžné funkce odlišné vlastnosti a aplikace. Funkce šipek mají jednoduchou syntaxi, dědění tento klíčové slovo z kontextu jejich použití, zatímco běžné funkce jsou přizpůsobivější a dokážou si poradit se složitějšími situacemi.

Je důležité vědět, jak se liší a jak je používat podle požadavků vašeho kódu. Při výběru typu funkce, kterou chcete použít, byste měli zvážit také rozdíly v kompatibilitě.

Šipka a běžné funkce JavaScriptu jsou nakonec výkonnými nástroji, které vám pomohou psát čistší a efektivnější kód.