6 forskelle mellem pilefunktioner og almindelige funktioner i JavaScript

Funktioner er en væsentlig del af JavaScript, som du skal bruge til at skrive genanvendelig kode. De to hovedtyper af funktioner er regulære funktioner og pilefunktioner, og der er mange måder at definere dem på.

Selvom de opfylder lignende behov, har de et par kritiske forskelle, som fundamentalt kan påvirke, hvordan du bruger dem i din kode. Lær alt om flere forskelle mellem pilefunktioner og almindelige funktioner.

1. Syntaksforskelle

Den syntaks, du vælger, når du udvikler JavaScript-funktioner, har stor betydning for, hvor nemt det er at læse og forstå din kode. Syntaksen for regulære funktioner og pilefunktioner varierer betydeligt, hvilket påvirker, hvordan du skriver og bruger dem.

JavaScript pile funktioner bruge en mindre sprogstruktur, der er mere forståelig. Du kan bruge dem til at oprette funktioner ved at kombinere dem til et enkelt udtryk eller sætning.

konst tilføje = (a, b) => a + b;

I dette eksempel er tilføje funktion accepterer to indgange, -en og b, og returnerer deres total. Det => tegn definerer dette som en pilefunktion.

På den anden side kræver definering af en almindelig funktion brugen af fungere nøgleord, med en mere udførlig syntaks, som vist i dette eksempel:

fungeretilføje(a, b) {
Vend tilbage a + b;
}

I dette eksempel er fungere nøgleordet definerer en almindelig funktion, som også bruger krøllede seler og Vend tilbage udmelding.

Regulære funktioner er mere nyttige til kompleks syntaks, der kræver flere sætninger eller udtryk. I modsætning hertil bruger pilefunktioner en mere kortfattet syntaks, der kan gøre din kode lettere at læse og forstå.

2. Omfangsforskelle

Udtrykket "omfang" beskriver, hvordan en funktions interne variabler og funktioner er tilgængelige. I JavaScript definerer og får du adgang til variabler og funktioner i hele din kode ved hjælp af scoping. Deres særskilte scoping kan have stor indflydelse på, hvordan du skriver og bruger JavaScript pil og almindelige funktioner.

I scoping, hvordan pilefunktioner håndterer det her nøgleordet adskiller sig væsentligt fra, hvordan normale funktioner gør. Almindelige funktioner definerer det her søgeord selv; derfor kan det ændre sig afhængigt af den kontekst, hvori du aktiverer funktionen.

På den anden side, fordi de ikke specificerer det her nøgleord, pilefunktioner bruger det samme det her som det statiske omfang, der omgiver dem.

For at se forskellen, tjek følgende eksempel. Lad os sige, at du har en person genstand med en navn egenskab og en metode kaldet sigNavn() der logger personens navn ved hjælp af en almindelig funktion:

konst person = {
 navn: 'John,'
 sigNavn: fungere() {
konsol.log(det her.navn);
 }
};
person.sayName(); // logger 'John'

Her er den almindelige sayName()-funktion en metode til personobjektet og det her nøgleord inde i den funktion refererer til det pågældende personobjekt.

Lad os nu prøve det samme med en pilefunktion:

konst person = {
 navn: 'John',
 sigNavn: () => {
konsol.log(det her.navn);
 }
};
person.sayName(); // logger udefineret

Fordi pilfunktionen, der bruges i sigNavn() metoden definerer ikke sin egen det her søgeord, bruger den det her af det statiske omfang, der omgiver det. I dette tilfælde er det instansens globale omfang.

Som et resultat, når du ringer person.sayName(), du får udefineret hellere end "John." Dette kan have stor indflydelse på, hvordan du skriver og bruger funktioner i din kode.

3. Use Cases og Best Practices

Almindelige funktioner er bedre egnede til funktioner, der kræver deres egne det her nøgleord, såsom metoder i et objekt.

Pilefunktioner er bedre egnet til funktionel programmering og tilbagekald, der ikke kræver det her søgeord.

4. Funktionsbindingsforskelle

Funktionsbinding er det udtryk, der bruges til at beskrive forholdet mellem det her nøgleord og funktioner i din kode. Variationerne i funktionsbinding mellem pilefunktioner og normale funktioner kan i høj grad påvirke, hvordan du konstruerer og bruger pilefunktioner.

Bruger det her nøgleordet gør det unikt i almindelige funktioner og associerer med forskellige objekter baseret på den metode, der bruges til at kalde funktionen. Funktionsbinding er en af ​​de vigtigste forskelle mellem regulære og pilefunktioner.

I modsætning hertil har pilefunktioner ikke det her søgeord; snarere får de det fra de omgivende skoper.

Lad os se på et eksempel for at forstå mere om denne forskel. Antag at du har en person genstand med en navn felt og en metode kaldet sigNavn() der bruger en almindelig funktion til at registrere personens navn:

konst person = {
 navn: 'John',
 sigNavn: fungere() {
konsol.log(det her.navn);
 }
};
konst en andenPerson = {
 navn: 'Jane'
};
person.sayName.call (en andenPerson); // logger 'Jane'

I dette eksempel kalder du personens objekts sigNavn() metode med værdien en anden person bruger opkald() metode. På grund af dette er sigNavn() metode, det her, er nøgleordet bundet til en anden person objekt, og det logger "Jane" hellere end "John."

Lad os nu bruge det samme med en pilefunktion:

konst person = {
 navn: 'John',
 sigNavn: () => {
konsol.log(det her.navn);
 }
};
konst en andenPerson = {
 navn: 'Jane'
};
person.sayName.call (en andenPerson); // logger udefineret

Siden sigNavn() teknik har ikke sit eget søgeord, du bruger en pilefunktion i det i dette eksempel. I dette tilfælde arver pilefunktionen egenskaberne for det omgivende scope, som er det globale scope.

Det betyder, at når du løber person.sayName.call (en andenPerson), pilefunktionens det her nøgleordet forbliver det globale objekt, og udefineret træder i stedet for Jane i loggen.

Hvis du skal binde en funktion til en bestemt det her værdi, kan en almindelig funktion være at foretrække. Men hvis du ikke behøver at binde en funktion til en bestemt det her værdi, kan en pilefunktion være kortere og lettere at forstå.

5. Implicit tilbagevenden

Pilfunktionen har en implicit returfunktion. Hvis funktionslegemet består af et enkelt udtryk, returnerer funktionerne dette udtryk.

Som et eksempel:

konst dobbelt = (x) => x * 2;

Denne pilefunktion returnerer en dobbelt fra en parameter. Du behøver ikke bruge en eksplicit Vend tilbage nøgleord, fordi funktionslegemet kun har ét udtryk.

6. Kompatibilitetsforskelle

Forskelle i kompatibilitet refererer til de tilføjede ECMAScript 6 pilefunktioner, som muligvis ikke virker med ældre browsere eller miljøer. På den anden side har almindelige funktioner eksisteret siden begyndelsen af ​​JavaScript og er bredt understøttet.

Her er en illustration af en pilefunktion, der muligvis ikke virker under mere etablerede forhold:

konst tilføje = (a, b) => a + b;

Følgende er en sammenlignelig regulær funktion, der burde fungere i de fleste situationer:

fungeretilføje(a, b) {
Vend tilbage a + b;
}

Brug almindelige funktioner i stedet for pilefunktioner, når du målretter mod ældre miljøer for at sikre kompatibilitet. Pilefunktioner kan dog give en syntaks, der er lettere at forstå og mere fortættet, når man arbejder med moderne browsere og miljøer.

Vælg mellem pilefunktioner og almindelige funktioner i JavaScript

I JavaScript har pile- og almindelige funktioner forskellige funktioner og applikationer. Pilefunktioner har en simpel syntaks, som arver det her søgeordsudtryk fra konteksten af ​​deres brug, mens almindelige funktioner er mere tilpasningsdygtige og kan håndtere mere komplekse situationer.

Det er vigtigt at vide, hvordan de adskiller sig, og hvordan man bruger dem i henhold til din kodes krav. Når du vælger, hvilken slags funktion du skal bruge, bør du også overveje kompatibilitetsforskelle.

I sidste ende er JavaScripts pil og almindelige funktioner kraftfulde værktøjer, der hjælper dig med at skrive renere og mere effektiv kode.