function
Deklaruje nazwaną funkcję: blok kodu z parametrami, który można wywoływać wiele razy i który może zwrócić wynik.
Przykład
#function calculateLevel(points) {
return Math.floor(points / 100) + 1
}
console.log(calculateLevel(0))
console.log(calculateLevel(250))Definicja i zastosowanie
#Deklaracja function tworzy funkcję o podanej nazwie. Funkcja to przepis zamknięty w bloku: przyjmuje dane przez parametry, wykonuje instrukcje i może zwrócić wynik słowem return. Raz napisaną wywołujesz dowolną liczbę razy.
Parametry mogą mieć wartości domyślne, używane, gdy argument nie zostanie podany. Parametr resztowy ...rest zbiera wszystkie nadmiarowe argumenty do tablicy. Funkcja, która nie wykona return, zwraca undefined.
Deklaracje funkcji są wynoszone (hoisting) w całości, więc możesz wywołać funkcję wyżej w pliku, niż ją zapisano. Nie dotyczy to wyrażeń funkcyjnych, np. const add = function () {}, które działają dopiero od linii przypisania.
Składnia
#function name(param1, param2) {
// instrukcje
return value
}
function name(param = defaultValue, ...rest) {}Więcej przykładów
#function summary(student = 'Gość', ...scores) {
const total = scores.reduce((sum, score) => sum + score, 0)
return `${student}: ${total} pkt`
}
console.log(summary('Ania', 10, 20, 30))
console.log(summary())console.log(double(21))
function double(n) {
return n * 2
}function applyBonus(points, rule) {
return rule(points)
}
function doubleBonus(points) {
return points * 2
}
console.log(applyBonus(40, doubleBonus))
console.log(applyBonus(40, (points) => points + 5))Obsługa przeglądarek
#Szeroko dostępne
Działa we wszystkich nowoczesnych przeglądarkach, także na telefonach. Możesz używać bez obaw.
- Chrome
- Edge
- Firefox
- Safari
Dobre praktyki
#- Nazywaj funkcje czasownikami, które mówią, co robią:
calculateTotal,formatDate,isValid. Kod czyta się wtedy prawie jak zdania. - Jedna funkcja powinna robić jedną rzecz. Jeśli jej opis wymaga słowa „i”, rozważ podział na dwie mniejsze.
- Brakujące argumenty dostają wartość
undefined, a nadmiarowe są ignorowane. JavaScript nie zgłosi błędu przy złej liczbie argumentów, więc warto sprawdzać dane na wejściu.
Powiązane hasła
#- () => {}Funkcja strzałkowa (arrow function): krótszy zapis funkcji, bez własnego this, z niejawnym return dla jednego wyrażenia.
- returnKończy działanie funkcji i przekazuje wartość do miejsca, w którym funkcję wywołano.
- classDefiniuje klasę, czyli szablon do tworzenia obiektów z tymi samymi polami i metodami.
- Spread (...)Składnia spread rozkłada tablicę, napis lub obiekt na pojedyncze elementy: do kopiowania, łączenia i przekazywania argumentów.
- DestrukturyzacjaDestrukturyzacja (destructuring) wyciąga wartości z tablic i obiektów prosto do osobnych zmiennych.
- function*Deklaruje generator: funkcję, która oddaje kolejne wartości przez yield i wstrzymuje się między nimi.
Widzisz błąd albo brakuje przykładu? Napisz do nas.