Publicitate

JavaScript ES6 a adus schimbări interesante în lumea dezvoltării web. Noi adăugări la limbajul JavaScript au adus noi posibilități.

Una dintre cele mai populare modificări a fost adăugarea funcțiilor săgeată în JavaScript. Funcțiile săgeată sunt un nou mod de a scrie expresii de funcții JavaScript, oferindu-vă două moduri diferite de a crea funcții în aplicația dvs.

Funcțiile săgeată necesită un pic de ajustare dacă sunteți un expert în funcții tradiționale JavaScript. Haideți să aruncăm o privire la ce sunt acestea, cum funcționează și cum vă avantajează.

Ce sunt funcțiile de săgeată JavaScript?

Funcțiile săgeată sunt un nou mod de a scrie expresii de funcții care au fost inclus în lansarea JavaScript ES6 Ce este ES6 și ce programatori Javascript trebuie să știeES6 se referă la versiunea 6 a limbajului de programare ECMA Script (Javascript). Să ne uităm acum la câteva modificări majore pe care ES6 le aduce JavaScript. Citeste mai mult . Sunt similare cu expresiile funcției JavaScript pe care le-ați folosit, cu câteva reguli ușor diferite.

instagram viewer

Funcțiile săgeată sunt întotdeauna funcții anonime, au reguli diferite pentru acest, și au o sintaxă mai simplă decât funcțiile tradiționale.

Aceste funcții folosesc un nou simbol cu ​​săgeată:

=>

Dacă ați lucrat vreodată la Python, aceste funcții sunt foarte similare cu Expresii Python Lambda Un ghid pentru începători pentru înțelegerea funcțiilor Python LambdaLambdas in Python este una dintre cele mai utile, importante și interesante caracteristici de știut. Iată cum să le folosești și de ce sunt utile. Citeste mai mult .

Sintaxa pentru aceste funcții este puțin mai curată decât funcțiile normale. Există câteva reguli noi de reținut:

  • Cuvântul cheie funcțional este eliminat
  • Cuvântul cheie retur este opțional
  • Bretelele cret sunt opționale

Există o mulțime de mici modificări, așa că să începem cu o comparație de bază a expresiilor de funcții.

Cum se utilizează funcțiile săgeată

Funcțiile săgeată sunt ușor de utilizat. Înțelegerea funcțiilor săgeții este mai ușoară atunci când sunt comparate cot la cot cu expresiile funcționale tradiționale.

Iată o expresie a funcției care adaugă două numere; mai întâi folosind metoda funcției tradiționale:

 let addnum = function (num1, num2) {return num1 + num2; }; addnum (1,2); >>3

Este o funcție destul de simplă, care ia două argumente și returnează suma.

Iată expresia schimbată într-o funcție săgeată:

let addnum = (num1, num2) => {return num1 + num2;}; addnum (1,2); >>3

Sintaxa funcției este destul de diferită folosind o săgeată. Cuvântul cheie funcție este eliminat; simbolul săgeții permite JavaScript să știe că scrii o funcție.

Brelocurile cret și cuvântul cheie de întoarcere sunt încă acolo. Acestea sunt opționale cu funcții săgeată. Iată un exemplu și mai simplu al aceleiași funcții:

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

Cuvântul cheie de întoarcere și bretelele cret sunt acum dispuse. Ceea ce a mai rămas este o funcție de o linie foarte curată, care este aproape jumătate din cod ca funcție inițială. Veți obține același rezultat cu un cod mult mai puțin scris.

Există mai multe funcții de săgeată. să ne adâncim mai adânc, astfel încât să aveți o mai bună simțire pentru ceea ce pot face.

Caracteristicile funcției săgeată

Funcțiile săgeată au multe utilizări și funcții diferite.

Funcții regulate

Funcțiile săgeată pot utiliza unul sau mai multe argumente. Dacă utilizați două sau mai multe argumente, trebuie să le adăugați între paranteze. Dacă aveți un singur argument, nu trebuie să folosiți paranteza.

fie pătrat = x => x * x pătrat (2); >>4

Funcțiile săgeată pot fi utilizate fără argumente. Dacă nu utilizați niciun argument în funcția dvs., trebuie să utilizați paranteza goală.

let helloFunction = () => Console.log ("Salut cititor!"); helloFunction (); >> Salut cititor!

Funcții simple ca acestea folosesc mult mai puțin cod. Imaginează-ți cât de ușor este un complex proiect precum o prezentare de diapozitive JavaScript Cum să construiți un SlideShow JavaScript în 3 pași simpliAstăzi vă voi arăta cum puteți construi o prezentare de diapozitive Javascript de la zero - să sărim direct! Citeste mai mult devine atunci când ai un mod mai simplu de a scrie funcții.

Folosind aceasta

Conceptul de acest tinde să fie cea mai complicată parte a utilizării JavaScript. Funcțiile săgeată fac acest mai ușor de utilizat.

Când utilizați funcții săgeată acest va fi definit prin funcția de închidere. Acest lucru poate crea probleme care apar atunci când creați funcții cuibărite și au nevoie acest pentru a aplica la funcția principală

Iată un exemplu popular care arată soluția pe care trebuie să o utilizați cu funcții obișnuite.

function Person () {var that = this; // Trebuie să atribuiți „asta” unei noi variabile care.age = 0; setInterval (funcția growUp () {that.age ++; }, 1000); }

Alocarea valorii de acest la o variabilă o face lizibilă când apelați o funcție din interiorul funcției principale. Acesta este dezordonat, iată o modalitate mai bună de a face acest lucru folosind funcțiile săgeată.

function Person () {this.age = 0; setInterval (() => {this.age ++; // Acum puteți utiliza „aceasta” fără o nouă variabilă declarată}, 1000); }

Deși sunt foarte bune pentru funcții, ele nu ar trebui utilizate pentru a crea metode în interiorul unui obiect. Funcțiile săgeată nu utilizează orientarea corectă pentru acest.

Iată un obiect simplu care creează o metodă în interior folosind o funcție săgeată. Metoda ar trebui să reducă topping-uri variabil cu unul când este chemat. În schimb, nu funcționează deloc.

lasa pizza = { toppings: 5, removeToppings: () => {this.toppings--; } } // Un obiect de pizza cu 5 toppinguri. > Pizza. >> {toppings: 5, removeToppings: f} pizza.removeToppings (); // Metoda nu va face nimic obiectului> pizza. >> {toppings: 5, removeToppings: f} // Mai are 5 toppings.

Lucrul cu Array-uri

Utilizând funcții săgeată puteți simplifica codul utilizat pentru a lucra cu metode de matrice. Schițe și metodele de matrice sunt părți foarte importante ale JavaScript 5 Metode de Array JavaScript pe care ar trebui să le stăpânești astăziDoriți să înțelegeți tablourile JavaScript, dar nu puteți face legătura cu ele? Verificați exemple de tablou JavaScript pentru instrucțiuni. Citeste mai mult deci le vei folosi foarte mult.

Există câteva metode utile precum Hartă metoda care rulează o funcție pe toate elementele unui tablou și returnează noul tablou.

lasa myArray = [1,2,3,4]; myArray.map (funcție (element) { element retur + 1; }); >> [2,3,4,5]

Aceasta este o funcție destul de simplă care adaugă una la fiecare valoare din tablou. Puteți scrie aceeași funcție cu mai puțin cod folosind o funcție săgeată.

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

Este mult mai ușor de citit acum.

Crearea Literalelor Obiectelor

Funcțiile săgeată pot fi utilizate pentru a crea literale obiect în JavaScript. Funcțiile obișnuite le pot crea, dar sunt mai mult timp.

let createObject = funcția createName (primul, ultimul) {return {first: first, last: last}; };

Puteți face același obiect cu o funcție săgeată folosind mai puțin cod. Folosind notarea săgeată, va trebui să înfășurați corpul funcției în paranteză. Iată sintaxa îmbunătățită cu funcțiile săgeții.

lasa createArrowObject = (primul, ultimul) => ({primul: primul, ultimul: ultimul});

Funcții săgeată JavaScript și nu numai

Acum știți câteva moduri diferite Funcțiile săgeții JavaScript vă fac viața mai ușoară ca dezvoltator. Acestea scurtează sintaxa, vă oferă mai mult control folosind acest, face obiectele mai ușor de creat și vă oferă un nou mod de a lucra cu metode de matrice.

Introducerea funcțiilor săgeată, împreună cu multe alte funcții, în JavaScript ES6 arată cât de importantă a devenit JavaScript în dezvoltarea web. Cu toate acestea, puteți face multe altele.

Doriți să aflați mai multe despre JavaScript? Al nostru Fișă de înșelătorie JavaScript Fișă de înșelare JavaScript finalăObțineți o actualizare rapidă a elementelor JavaScript cu această foaie de înșelăciune. Citeste mai mult oferă informații valoroase și învățare mai multe despre cum funcționează JavaScript Ce este JavaScript și cum funcționează?Dacă înveți dezvoltarea web, iată ce trebuie să știi despre JavaScript și cum funcționează cu HTML și CSS. Citeste mai mult te poate face un dezvoltator mai bun.

Anthony Grant este un scriitor independent care acoperă programare și software. Este un specialist în informatică care se ocupă de programare, Excel, software și tehnologie.