Lär dig datavetenskap med JavaScript Del 4, Funktioner

Introduktion

Antag att du har en fil som är 82 linjer lång och består bara av en rad uttalanden. (Jag hoppas det här är inte sant, men allt är möjligt.) Hur skulle du förstå vad programmet gör? Hur skulle du ändra det eller använda det? Det skulle vara svårt att göra något med den här koden eftersom det inte finns någon struktur för det.  

För att lösa detta problem kan du använda funktioner. En funktion är en grupp uttalanden som utför en specifik uppgift. Funktioner gör att vi kan bryta upp ett program till mindre program, vilket gör vår kod mer läsbar, återanvändbar och testbar.

Innehåll

  • Raderade funktioner
  • Värdeåtersändningsfunktion
  • Omfattning
  • parametrar
  • moduler

Raderade funktioner

Denna typ av funktion listar steg för programmet att utföra. Tänk på att vi skriver ett program för att logga in en användare på en webbplats. Programmet kan bestå av följande uppgifter:

  • Hämta användarnamnet
  • Hämta lösenordet
  • Kontrollera om användarnamnet och lösenordet finns
  • Omdirigera användaren till instrumentbrädan

Var och en av dessa steg kan innehålla en inloggningsfunktion. Detta är ett exempel funktion:

funktion greet () console.log ("Hej, Världen");  

Detta är den allmänna formen av en funktion:

funktionsfunktionName () statement; påstående; etc. 

För att utföra funktionen (även kallad funktionen kallas funktionen), skriver du ett uttalande som kallar det.

hälsa(); 

De () är där vi passerar inmatning till funktionen. När vi definierar funktionen kallas ingången en parameter. När vi kallar funktionen blir ingången det verkliga värdet och kallas argumentet. Exempel:

funktion hälsning (namn) console.log ("Hej," + namn);  hälsar ("Alberta"); // Hej Alberta 

Med JavaScript ES6 kan du definiera funktioner med pilsyntax. Här är vår hälsningsfunktion definierad med pilsyntax:

låt hälsa = () => console.log ("Hej, Världen");

En funktion med en parameter:

let greet = name => console.log ("Hej," + namn);

En funktion med mer än en parameter:

låt hälsa = (fname, lname) => console.log ("Hej," + fname + "" + namn); 

En funktion med flera uttalanden:

låt hälsa = (fname, lname) => let name = fname + "" + name; console.log ("Hej," + namn); 

Eftersom en pilfunktion är en anonym funktion, ger vi vår funktion ett namn genom att tilldela det till en variabel. Pilfunktioner kan vara användbara när din funktionskropp bara har ett uttalande.

Värdeåtergångsfunktion

Denna typ av funktion returnerar ett värde. Funktionen måste sluta med en returdeklaration. Detta exempel returnerar summan av två nummer.

funktion lägg till (x, y) return x + y; 

Detta är den allmänna formen som definierar en värdeåtergivande funktion:

funktionsfunktionName () statement; påstående; etc. returnera uttryck;  

Värdet av uttryck är vad som blir resultatet av funktionen. Denna typ av funktion är användbar när den lagras i en variabel. 

låt variableName = functionName (); 

Omfattning

En variabels räckvidd är den del av programmet där en variabel kan nås. En variabel kan vara lokal eller global. En lokal variabels räckvidd är inuti funktionen den skapades i. Ingen kod utanför funktionen kan nå sina lokala variabler. 

Även när du använder låta eller const att deklarera en variabel, de har blockomfattning. Ett block är en uppsättning uttalanden som hör samman som en grupp. Ett block kan vara så enkelt som att paketera vår kod i lockiga axlar:

låt a = 2; 

Variabeln en är lokal till blocket den är i. Ett block kan också vara en slinga eller ett if-uttalande. Exempel:  

låt a = 1; om (5> 4) låt a = 2;  console.log (a); // 1 

Eftersom vårt konsoldeklaration ligger i samma omfattning som vår första variabel en, det visar det värdet, vilket är 1. Det har inte tillgång till variablerna i if-blocket. Tänk nu på det här exemplet:

låt a = 1; om (5> 4) låt a = 2; console.log (a); // 2

Nu kommer 2 att visas eftersom omfattningen av variabler som vårt konsolutdrag har tillgång till ligger inom if-blocket. En funktions parametrar är också lokala variabler och kan endast nås med kod inuti funktionen. Globala variabler, å andra sidan, kan nås av alla uttalanden i ett programs fil. Exempel:

låt a = 1; funktion foo () a = 2;  console.log (a); // 1 foo (); console.log (a); // 2

I detta exempel, en är en global variabel, och vi har tillgång till den inom foo-funktionen. Den första konsolen uttalandet kommer att visas 1. Efter samtal foo, värdet av en är inställd på 2, vilket gör den andra konsolen uppgift display 2. 

Globala variabler ska användas mycket litet, helst inte alls. Eftersom globala variabler kan nås av någon del av ett program riskerar de att förändras på oförutsägbara sätt. I ett stort program med tusentals kodposter gör det programmet svårare att förstå, eftersom du inte enkelt kan se hur variabeln används. Det är bättre att skapa och använda lokala variabler.

Men om du behöver använda en variabel på flera ställen i ditt program är det OK att använda en global konstant. Deklarera en variabel med const sökordet hindrar det från att ändras, vilket gör det säkrare att använda. Du behöver bara oroa dig för att uppdatera värdet på konstanten på den plats som den deklarerades.

parametrar

Minns att en parameter är en variabel som en funktion använder för att acceptera data. Parametern är tilldelad värdet av en funktions argument när funktionen heter. Från och med ES6 kan parametrar också ges standardvärden med formatet parameterName = värde. I det här fallet kan du ringa en funktion utan argument, och det kommer att använda standardvärdena. Exempel:

funktionshälsning (namn = "värld") console.log ("Hej," + namn);  hälsar (); //Hej världen

Spridnings- / viloperatören är ny för ES6 och kan användas för att antingen expandera en array eller ett objekt i individuella värden eller samla parametrarna för en funktion i en array. Det här är ett exempel på att använda en viloparameter:

funktion foo (... args) console.log (args);  foo (1, 2, 3, 4, 5); // [1, 2, 3, 4, 5]

moduler

Anta att du nu har en fil som har 1.082 linjer. (Jag har sett det här, och du borde springa om du stöter på en sådan sak.) Filen är organiserad i funktioner, men det är svårt att se hur de relaterar till varandra. 

För att gruppera relaterat beteende borde vi sätta vår kod i moduler. En modul i ES6 är en fil som innehåller relaterade funktioner och variabler. Moduler låter oss dölja privata egenskaper och avslöja offentliga egenskaper som vi vill använda i andra filer. Filnamnet skulle vara namnet på modulen. Moduler har också sin egen räckvidd. För att kunna använda variabler utanför modulens räckvidd måste de exporteras. Variabler som inte exporteras kommer att vara privata och kan endast nås inom modulen.  

Enskilda egenskaper kan exporteras så här:

exportfunktion foo () console.log ("Hello World");  Exportera låtfältet = 82; export låt baz = [1,2,3];

Alternativt kan alla egenskaper exporteras med en exportdeklaration:

funktion foo () console.log ("Hello World");  låt bar = 82; låt baz = [1,2,3]; export foo, bar, baz;

För att använda en moduls variabler, importerar du den i filen. Du kan ange vad du vill importera från modulen så här:

importera foo, bar, baz från "foo"; 

Du kan också byta namn på din import:

importera foo som Foo från "foo"; Foo ();

Eller du kan importera alla modulernas egenskaper:

importera * som myModule från "foo"; myModule.foo ();

Recension

Funktioner gör att vi kan dela våra program i mindre program som vi enkelt kan hantera. Denna praxis är känd som modularisering. Det finns två typer av funktioner: tomrumsfunktioner och värdefunktioner som returnerar. En tomrumsfunktion utför deklarationerna inuti den. En värdeåtergivande funktion ger oss tillbaka ett värde.  

Omfattning är den del av programmet där en variabel kan nås. Variabler som deklareras i en funktion, inklusive funktionens parametrar, är lokala. Block har också utrymme, och lokala variabler kan skapas inuti dem. 

Variabler som inte bifogas i ett block eller en modul kommer att vara globala. Om du behöver en global variabel är det acceptabelt att ha en global konstant. Annars försök att innehålla din kod till moduler eftersom moduler har eget räckvidd. Men ännu bättre, moduler ger din kodstruktur och organisation.  

Medel

  • repl.it
  • ES6-specifikation
  • Du vet inte JS: ES6 och Beyond