Modest Programmer logo
13 września 2018
Tagi: JavaScript
Kontynuując temat nowości wprowadzonych w ES6, dzisiaj - w dniu programisty opiszę Ci funkcję strzałkowe. W skrócie funkcje strzałkowe są to funkcji o krótszej i zwięzłej składni, wykorzystujące tak zwaną strzałkę, czyli znaki =>.

Zacznijmy od najprostszych przykładów, czyli napiszmy funkcję za pomocą standardowej składni, zwracającą losową wartość.
let getRandomNumber = function() {
    return Math.random();
}
console.log(getRandomNumber()); //0.9760714658754956
W powyższej funkcji wszystko powinno być już dla Ciebie jasne. Skorzystaliśmy z metody random obiektu Math, który zwraca losową liczbę z przedziału od 0 do 1. O obiekcie Math pisałem już w 1 z poprzednich artykułów, także na pewno już wszystko wiesz na ten temat :) Teraz zobacz jak taką samą funkcję możesz zapisać używając funkcji strzałkowej:
let getRandomNumberArrow1 = () => {
    return Math.random();
}
console.log(getRandomNumberArrow1()); //0.22574396180293177
Jak widzisz pominięte zostało tutaj słowo kluczowe function, pozostały puste nawiasy w których mogą być wprowadzane parametry oraz nawiasy klamrowe, w których zawarte jest ciałko funkcji.
let getRandomNumberArrow2 = () => Math.random();
console.log(getRandomNumberArrow2()); //0.01684335901442857
Zauważ, że w powyższym przykładzie zostały również pominięte nawiasy klamrowe oraz słowo return. Na taki zapis możesz sobie pozwolić w przypadku funkcji zwracających wartość i jeżeli w ciele funkcji znajduje się tylko 1 instrukcja.
let getNumber = (x) => x;
console.log(getNumber(2)); //2
W powyższym przykładzie jako parametr został przekazany x. Podobnie jak poprzednio, dlatego że funkcja zwraca wartość i zawiera tylko 1 instrukcję zostały pomięte nawiasy klamrowe oraz słowo return.
let multiplyNumber = x => x * x;
console.log(multiplyNumber(2)); //4
Jeżeli funkcja przyjmuje tylko 1 parametr mogą zostać pominięte nawiasy, tak jak to widać na przykładzie powyżej.
let addNumbers = (x, y) => x + y;
console.log(addNumbers(2, 4)); //6
W przypadku, gdy funkcja ma 2 lub więcej parametrów muszę one być w nawiasach.

Oprócz powyższych zmian, funkcja strzałkowa zmienia także kontekst dla this, ale dlatego że nie pisałem jeszcze żadnego artykułu o this, na tą chwilę pominę ten temat, ale jeszcze do niego powrócimy w kolejnych artykułach.

To wszystko co chciałem Ci przekazać w tym artykule. Zapraszam Cię do kolejnych artykułów z serii podstaw programowania w języku JavaScript.

Poprzedni artykuł - Template string w JavaScript.
Następny artykuł - Zakres lokalny vs zakres globalny w JavaScript.
Autor artykułu:
Kazimierz Szpin
Kazimierz Szpin
Programista. Specjalizuje się w C#, głównie WPF, Windows Forms oraz ASP.NET MVC.
Autor bloga ModestProgrammer.pl
Dodaj komentarz
© Copyright 2018 modestprogrammer.pl. Wszelkie prawa zastrzeżone Design by Kazimierz Szpin