Oglas

JavaScript ES6 je v svet spletnega razvoja prinesel vznemirljive spremembe. Novi dodatki k jeziku JavaScript so prinesli nove možnosti.

Ena bolj priljubljenih sprememb je bilo dodajanje puščic v JavaScript. Funkcije puščic so nov način za pisanje izrazov funkcije JavaScript, kar vam omogoča dva različna načina za ustvarjanje funkcij v vaši aplikaciji.

Funkcije puščic se nekoliko prilagodijo, če ste strokovnjak za tradicionalne funkcije JavaScript. Poglejmo, kaj so to, kako delujejo in kako vam koristijo.

Kaj so funkcije puščice JavaScript?

Funkcije puščic so nov način za zapisovanje funkcijskih izrazov vključeno v izdajo JavaScript ES6 Kaj je ES6 in kaj morajo poznati programerji JavascriptES6 se nanaša na različico 6 programskega jezika skripta ECMA (Javascript). Poglejmo zdaj nekaj večjih sprememb, ki jih ES6 prinaša v JavaScript. Preberi več . Podobni so izrazom funkcije JavaScript, ki ste jih uporabljali, z nekaj nekoliko drugačnimi pravili.

Funkcije puščic so vedno anonimne funkcije in imajo različna pravila za toin imajo enostavnejšo skladnjo kot tradicionalne funkcije.

instagram viewer

Te funkcije uporabljajo nov puščico:

=>

Če ste kdaj delali v Pythonu, so te funkcije zelo podobne Izrazi Python Lambda Vodnik za začetnike za razumevanje funkcij Python LambdaLambde v Pythonu so ena najbolj uporabnih, pomembnih in zanimivih lastnosti. Tukaj je opisano, kako jih uporabljati in zakaj so koristni. Preberi več .

Sintaksa za te funkcije je nekoliko bolj čista od običajnih funkcij. Upoštevati je treba nekaj novih pravil:

  • Funkcijska ključna beseda je odstranjena
  • Vrnitev ključne besede ni obvezna
  • Curly naramnice so izbirne

Obstaja veliko majhnih sprememb, zato začnimo z osnovno primerjavo izrazov funkcij.

Kako uporabljati puščice

Funkcije puščic so preproste za uporabo. Razumevanje puščic je lažje v primerjavi s tradicionalnimi izrazi funkcij.

Tu je izraz funkcije, ki doda dve številki; najprej uporabimo tradicionalno funkcijsko metodo:

 naj addnum = funkcija (num1, num2) {vrne num1 + num2; }; addnum (1,2); >>3

To je precej preprosta funkcija, ki vzame dva argumenta in vrne vsoto.

Tu je izraz spremenjen v funkcijo puščice:

pustimo addnum = (num1, num2) => {vrnemo num1 + num2;}; addnum (1,2); >>3

Sintaksa funkcije je s funkcijo puščice precej drugačna. Funkcijska ključna beseda je odstranjena; puščica s puščico omogoča, da JavaScript ve, da pišete funkcijo.

Curly naramnice in povratna ključna beseda sta še vedno prisotni. Te so s funkcijami puščic neobvezna. Tu je še enostavnejši primer iste funkcije:

pusti addnum = (num1, num2) => num1 + num2;

Povratne ključne besede in kodraste naramnice zdaj ni več. Levo je zelo čista enovrsticna funkcija, ki je skoraj polovica kode kot prvotna funkcija. Enak rezultat dobite z veliko manj napisano kodo.

Funkcij puščic je več. potopimo se globlje, da boste bolje občutili, kaj lahko storijo.

Funkcije puščic

Funkcije puščic vključujejo veliko različnih načinov uporabe in funkcij.

Redne funkcije

Puščice lahko uporabljajo enega ali več argumentov. Če uporabljate dva ali več argumentov, jih morate priložiti v oklepaju. Če imate samo en argument, vam ni treba uporabljati oklepajev.

naj bo kvadrat = x => x * x kvadrat (2); >>4

Funkcije puščic se lahko uporabljajo brez argumentov. Če v svoji funkciji ne uporabljate nobenih argumentov, morate uporabiti prazne oklepaje.

pustite helloFunction = () => Console.log ("Pozdravljen bralnik!"); helloFunction (); >> Pozdravljeni bralec!

Preproste funkcije, kot so te, uporabljajo veliko manj kode. Predstavljajte si, kako lažje je kompleks projekt kot diaprojekcija JavaScript Kako sestaviti JavaScript SlideShow v 3 preprostih korakihDanes vam bom pokazal, kako iz ničesar sestaviti diaprojekcijo Javacript - skočiva noter! Preberi več postane, ko imate enostavnejši način pisanja funkcij.

Uporaba tega

Koncept to ponavadi je najzahtevnejši del uporabe JavaScript. Funkcije puščic omogočajo to enostavnejša za uporabo.

Ko uporabljate puščice to bo definirana s priloženo funkcijo. To lahko povzroči težave, ki nastanejo, ko ustvarite ugnezdene funkcije in potrebe to uveljaviti za svojo glavno funkcijo

Tu je priljubljen primer, ki prikazuje rešitev, ki jo morate uporabljati z običajnimi funkcijami.

funkcija Person () {var da = to; // "To" morate dodeliti novi spremenljivki that.age = 0; setInterval (funkcija rasteUp () {that.age ++; }, 1000); }

Dodelitev vrednosti to na spremenljivko omogoča berljivost, ko pokličete funkcijo znotraj svoje glavne funkcije. To je zmedeno, tukaj je boljši način za to s pomočjo puščic.

funkcija oseba () {this.age = 0; setInterval (() => {this.age ++; // Zdaj lahko uporabite 'to' brez nove spremenljivke, označene}, 1000); }

Čeprav so odlične za funkcije, jih ne bi smeli uporabljati za ustvarjanje metod znotraj predmeta. Funkcije puščic ne uporabljajo pravega merjenja to.

Tu je preprost predmet, ki ustvari metodo v notranjosti s pomočjo puščice. Metoda naj bi zmanjšala prelivi spremenljiv za enega, ko ga pokličemo. Namesto tega sploh ne deluje.

pica pusti = { prelivi: 5, odstraniteToppings: () => {this.toppings--; } } // Objekt pice s 5 prelivi. > pica. >> {prelivi: 5, odstraniteToppings: f} pizza.removeToppings (); // Metoda ne bo ničesar naredila za objekt> pico. >> {toppings: 5, removeToppings: f} // Še vedno ima 5 prelivov.

Delo z nizi

S pomočjo puščic lahko poenostavite kodo, ki jo uporabljate za metode matrike. Niz in Metode matrike so zelo pomembni deli JavaScript 5 metod Arhiv JavaScript, ki bi jih morali obvladati danesŽelite razumeti JavaScript matrike, vendar se z njimi ne morete spoprijeti? Za navodila si oglejte primere matrike JavaScript. Preberi več zato jih boste veliko uporabljali.

Obstaja nekaj uporabnih metod, kot je zemljevid metoda, ki izvaja funkcijo na vseh elementih matrike in vrne novo matriko.

pustite myArray = [1,2,3,4]; myArray.map (funkcija (element) { povratni element + 1; }); >> [2,3,4,5]

To je precej preprosta funkcija, ki doda vsako vrednost vsaki matriki. S funkcijo puščice lahko napišete isto funkcijo z manj kode.

pustite myArray = [1,2,3,4]; myArray.map (element => { povratni element + 1; }); >> [2,3,4,5]

Zdaj je veliko lažje brati.

Ustvarjanje objektnih knjižnic

Funkcije puščic se lahko uporabljajo za ustvarjanje predmetnih literal v JavaScript. Redne funkcije jih lahko ustvarijo, vendar so nekoliko daljše.

pustite createObject = funkcija createName (prva, zadnja) {return {first: first, last: last}; };

Isti predmet lahko naredite s puščico s pomočjo manj kode. S zapisom puščic boste morali funkcijsko telo zaviti v oklepaje. Tu je izboljšana sintaksa s funkcijami puščic.

naj ustvariArrowObject = (prvi, zadnji) => ({prvi: prvi, zadnji: zadnji});

Funkcije puščice v JavaScript in naprej

Zdaj veste nekaj različnih načinov, da funkcije puščic v JavaScript olajšajo vaše življenje kot razvijalec. Skrajšajo sintakso, omogočajo več nadzora pri uporabi to, olajšajte ustvarjanje predmetov in vam omogočite nov način dela z načini matrike.

Uvedba puščic, skupaj s številnimi drugimi funkcijami, v JavaScript ES6 prikazuje, kako pomemben je JavaScript v spletnem razvoju. Vendar lahko storite toliko več.

Želite izvedeti več o JavaScriptu? Naše JavaScript varalica Ultimate JavaScript Cheat SheetNajprej se osvežite za elemente JavaScript s to listo. Preberi več ponuja dragocene informacije in več o tem kako deluje JavaScript Kaj je JavaScript in kako deluje?Če se učite spletnega razvoja, je to, kar morate vedeti o JavaScript in kako deluje s HTML in CSS. Preberi več vas lahko naredi boljšega razvijalca.

Anthony Grant je samostojni pisatelj, ki pokriva programiranje in programsko opremo. Je glavni računalnik računalništva v programiranju, Excelu, programski opremi in tehnologiji.