Home-theater-designers
JavaScript ES6 a adus schimbări interesante în lumea dezvoltării web. Noile adăugiri 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ăgeți 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 expert în funcții tradiționale JavaScript. Să aruncăm o privire la ce sunt acestea, cum funcționează și cum vă avantajează.
Ce sunt funcțiile săgeții JavaScript?
Funcțiile săgeată sunt o nouă modalitate de a scrie expresii funcționale care au fost inclus în versiunea JavaScript ES6 . Sunt similare cu expresiile funcției JavaScript pe care le-ați folosit, cu câteva reguli ușor diferite.
Funcțiile săgeți sunt întotdeauna funcții anonime, au reguli diferite pentru
this, și au o sintaxă mai simplă decât funcțiile tradiționale.
are iphone 7 modul portret
Aceste funcții utilizează un nou jeton săgeată:
=>Dacă ați lucrat vreodată în Python, aceste funcții sunt foarte asemănătoare Expresii Python Lambda .
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ție este eliminat
- Cuvântul cheie return este opțional
- Aparatele dentare sunt opționale
Există o mulțime de mici modificări de parcurs, așa că să începem cu o comparație de bază a expresiilor funcționale.
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 este comparată una lângă alta cu expresiile funcționale tradiționale.
Iată o expresie de funcție care adaugă două numere; folosind mai întâi metoda funcției tradiționale:
let addnum = function(num1,num2){
return num1 + num2;
};
addnum(1,2);
>>3Este 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);
>>3Sintaxa funcției este destul de diferită folosind o funcție săgeată. Cuvântul cheie funcție este eliminat; simbolul săgeată permite JavaScript să știe că scrieți o funcție.
Acoladele și cuvântul cheie return 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 return și acoladele curate au dispărut. Ceea ce a rămas este o funcție foarte curată pe o singură linie, care reprezintă aproape jumătate din cod ca funcția originală. Obțineți același rezultat cu mult mai puțin cod scris.
Există mai multe despre funcțiile săgeată. să ne scufundăm mai adânc, pentru a avea o senzație mai bună a ceea ce pot face.
Caracteristici ale funcției săgeată
Funcțiile săgeată au multe utilizări și caracteristici diferite incluse.
cum să obțineți computerul să recunoască telefonul
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 încadrați în paranteză. Dacă aveți un singur argument, nu este nevoie să utilizați paranteze.
let square = x => x * x
square(2);
>>4Funcțiile săgeată pot fi utilizate fără argumente. Dacă nu utilizați niciun argument în funcția dvs., trebuie să utilizați paranteze goale.
let helloFunction = () => Console.log('Hello reader!');
helloFunction();
>>Hello reader!Funcții simple ca acestea folosesc mult mai puțin cod. Imaginați-vă cât de ușor este un complex proiect ca un slideshow JavaScript devine atunci când aveți un mod mai simplu de a scrie funcții.
Folosind asta
Conceptul de
thistinde să fie cea mai dificilă parte a utilizării JavaScript. Funcțiile săgeții fac
thismai ușor de utilizat.
Când utilizați funcții săgeată
thisva fi definit de funcția de anexare. Acest lucru poate crea probleme care apar atunci când creați funcții imbricate și aveți nevoie
thispentru a vă aplica funcției dvs. principale
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; //You have to assign 'this' to a new variable
that.age = 0;
setInterval(function growUp() {
that.age++;
}, 1000);
}Atribuirea valorii
thisla o variabilă îl face lizibil atunci când apelați o funcție din funcția principală. Acest lucru 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++; // Now you can use 'this' without a new variable declared
}, 1000);
}Deși sunt excelente pentru funcții, acestea nu ar trebui utilizate pentru a crea metode în interiorul unui obiect. Funcțiile săgeată nu folosesc scopul adecvat pentru
this.
Iată un obiect simplu care creează o metodă în interior folosind o funcție săgeată. Metoda ar trebui să reducă toppinguri variabilă cu una când este apelat. În schimb, nu funcționează deloc.
dimensiunea fișierului paginii pentru 16 GB RAM
let pizza = {
toppings: 5,
removeToppings: () => {
this.toppings--;
}
}
//A pizza object with 5 toppings
>pizza
>>{toppings: 5, removeToppings: f}
pizza.removeToppings(); //The method will not do anything to the object
>pizza
>>{toppings: 5, removeToppings: f} //Still has 5 toppings
Lucrul cu matricele
Folosind funcțiile săgeată puteți simplifica codul utilizat pentru a lucra cu metodele matrice. Matrice și metodele matrice sunt părți foarte importante din JavaScript deci le vei folosi foarte mult.
Există câteva metode utile, cum ar fi Hartă metoda care rulează o funcție pe toate elementele unui tablou și returnează noua matrice.
let myArray = [1,2,3,4];
myArray.map(function(element){
return element + 1;
});
>> [2,3,4,5]Aceasta este o funcție destul de simplă, care adaugă una la fiecare valoare din matrice. Puteți scrie aceeași funcție cu mai puțin cod folosind o funcție săgeată.
let myArray = [1,2,3,4];
myArray.map(element => {
return element + 1;
});
>> [2,3,4,5]Este mult mai ușor de citit acum.
Crearea literelor obiectelor
Funcțiile săgeată pot fi folosite pentru a crea literale obiect în JavaScript. Funcțiile obișnuite le pot crea, dar sunt puțin mai lungi.
let createObject = function createName(first,last) {
return {
first: first,
last: last
};
};Puteți crea același obiect cu o funcție săgeată folosind mai puțin cod. Folosind notația săgeată va trebui să înfășurați corpul funcției în paranteză. Iată sintaxa îmbunătățită cu funcții săgeată.
let createArrowObject = (first,last) => ({first:first, last:last});Funcțiile săgeții JavaScript și dincolo
Acum cunoașteți câteva moduri diferite în care funcțiile săgeții JavaScript vă ușurează viața ca dezvoltator. Acestea scurtează sintaxa, vă oferă mai mult control folosind
this, face obiectele mai ușor de creat și vă oferă o nouă modalitate de a lucra cu metodele matrice.
Introducerea funcțiilor săgeată, împreună cu multe alte caracteristici, în JavaScript ES6 arată cât de important a devenit JavaScript în dezvoltarea web. Totuși, puteți face mult mai mult.
Doriți să aflați mai multe despre JavaScript? Aflați aceste cadre JavaScript. În plus, a noastră Foaie de trucuri JavaScript oferă informații valoroase și învață mai multe despre cum funcționează JavaScript vă poate face un dezvoltator mai bun.
Acțiune Acțiune Tweet E-mail 6 alternative sonore: cele mai bune aplicații de cărți audio gratuite sau ieftineDacă nu vă place să plătiți pentru cărți audio, iată câteva aplicații grozave care vă permit să le ascultați gratuit și legal.
Citiți în continuare Subiecte asemănătoare- Programare
- JavaScript
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.
Mai multe de la Anthony GrantAboneaza-te la newsletter-ul nostru
Alăturați-vă newsletter-ului pentru sfaturi tehnice, recenzii, cărți electronice gratuite și oferte exclusive!
Faceți clic aici pentru a vă abona