Operator rest (...) pozwala na reprezentowanie nieskończonej liczby argumentów jako tablicę. Jest użyteczny w wielu scenariuszach, takich jak zbieranie pozostałych argumentów funkcji, destrukturyzacja tablic i obiektów. Operator rest jest nieoceniony w nowoczesnym JavaScript, ułatwiając pracę z dynamicznymi danymi i funkcjami o zmiennej liczbie argumentów.
Przykłady użycia operatora Rest
Poniższy przykład kodu ilustruje różne zastosowania operatora rest w JavaScript, zawarte w kompletnym pliku HTML.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Operator Rest w JavaScript</title>
</head>
<body>
<h3>Przykłady użycia operatora Rest w JavaScript</h3>
<script>
// Przykład 1: Zbieranie pozostałych argumentów funkcji
// Funkcja sumuje dowolną liczbę argumentów
function sum(...numbers) {
return numbers.reduce((acc, current) => acc + current, 0);
}
console.log(sum(1, 2, 3, 4)); // 10
// Przykład 2: Destrukturyzacja tablic z pozostałymi elementami
// Pobieranie pierwszego elementu i reszty tablicy
const [first, ...restOfItems] = [10, 20, 30, 40];
console.log(first); // 10
console.log(restOfItems); // [20, 30, 40]
// Przykład 3: Kombinacja z parametrami pozycyjnymi
// Funkcja przyjmuje pierwszy parametr osobno, a resztę zbiera
function separateFirstFromRest(firstParam, ...restParams) {
console.log(`Pierwszy parametr: ${firstParam}`);
console.log(`Pozostałe parametry: ${restParams}`);
}
separateFirstFromRest('alfa', 'beta', 'gamma'); // alfa, ['beta', 'gamma']
// Przykład 4: Rest w destrukturyzacji obiektów (ES2018)
// Pobieranie wybranych właściwości obiektu, reszta w nowym obiekcie
let {brand, model, ...otherCarDetails} = {
brand: "Ford",
model: "Mustang",
year: 1969,
color: "red"
};
console.log(brand); // Ford
console.log(model); // Mustang
console.log(otherCarDetails); // { year: 1969, color: "red" }
</script>
</body>
</html>
Podsumowanie
Operator rest jest niezwykle przydatnym narzędziem w arsenale dewelopera JavaScript, umożliwiającym efektywne zarządzanie argumentami funkcji i destrukturyzację danych. Umożliwia łatwe zbieranie pozostałych elementów do tablicy, co czyni kod bardziej zwięzłym, czytelnym i elastycznym. Zarówno w destrukturyzacji obiektów, jak i tablic, operator rest okazuje się być kluczowym elementem nowoczesnego JavaScript.
Jeżeli chcesz przyśpieszyć swoją naukę tworzenia stron chciałbym polecić mój kurs JavaScript od podstaw w którym nauczysz się tego języka od podstaw do zaawansowanych jego aspektów.