Rest Parameter JavaScript: Fungsi, Sintaks, Contoh
Irhan Hisyam Dwi Nugroho
•
04 Mei 2026
•
42
Pernah bingung bagaimana cara menangani jumlah argumen fungsi yang tidak selalu sama di JavaScript? Rest parameter JavaScript adalah fitur yang bisa digunakan untuk mengumpulkan banyak argumen menjadi satu array.
Dalam proses belajar JavaScript, warga bimbingan biasanya akan menemukan kasus ketika jumlah parameter dalam fungsi tidak selalu sama. Nah, rest parameter hadir untuk mempermudah penanganan kondisi tersebut.
Pada artikel ini, kita akan membahas fungsi, sintaks, dan contoh rest parameter JavaScript secara sederhana. Penjelasannya dibuat ringan supaya mudah dipahami oleh pemula.
Baca juga: Panduan Memilih Bootcamp Full Stack Developer yang Tepat
Apa Itu Rest Parameter JavaScript?
Rest parameter JavaScript adalah fitur untuk menampung banyak argumen dalam sebuah fungsi menjadi satu array.
Bentuk rest parameter ditulis dengan tanda tiga titik sebelum nama parameter, seperti ...args atau ...data.
Dengan rest parameter, fungsi bisa menerima jumlah argumen yang tidak tetap tanpa harus menulis banyak parameter satu per satu. Fitur ini berguna untuk perhitungan, pengolahan daftar data, atau input yang jumlahnya bisa berubah-ubah.
Baca juga: Full Stack Developer Career Path: Level, Skill, dan Gaji
Sintaks Rest Parameter
Sumber: Canva
Sintaks rest parameter JavaScript ditulis menggunakan tanda tiga titik ... sebelum nama parameter. Sintaks ini digunakan untuk menampung banyak argumen menjadi satu array di dalam fungsi.
function namaFungsi(...args) { console.log(args); } |
Berikut contoh penerapan rest parameter dalam fungsi penjumlahan. Semua nilai yang dikirim akan masuk ke parameter angka dalam bentuk array.
function jumlah(...angka) { return angka.reduce((total, nilai) => total + nilai, 0); } console.log(jumlah(10, 20, 30)); // 60 |
Pada contoh tersebut, rest parameter membuat fungsi bisa menerima jumlah angka yang berbeda-beda tanpa perlu menambah parameter secara manual. Hal ini membuat kode lebih fleksibel dan mudah digunakan.
Baca juga: Panduan Belajar Full Stack Developer dengan Mudah
Contoh Penggunaan Rest Parameter
Setelah memahami pengertian dan sintaksnya, sekarang saatnya melihat bagaimana rest parameter digunakan dalam berbagai kondisi di JavaScript. Warga bimbingan bisa memakai fitur ini untuk membuat fungsi yang lebih fleksibel dan mudah dikelola.
1. Menjumlahkan Banyak Angka
Rest parameter sering digunakan untuk menerima banyak angka dalam satu fungsi. Semua angka akan dikumpulkan menjadi array sehingga lebih mudah diproses menggunakan method array.
Cara ini membuat fungsi penjumlahan jadi lebih praktis tanpa harus menentukan jumlah parameter.
function jumlah(...angka) { return angka.reduce((a, b) => a + b, 0); } console.log(jumlah(1, 2, 3, 4)); |
Output:
10 |
2. Menggabungkan Banyak Data
Rest parameter bisa digunakan untuk menggabungkan beberapa data menjadi satu array. Teknik ini cocok ketika data yang diterima jumlahnya tidak tetap. Hasilnya, proses pengolahan data menjadi lebih fleksibel.
function gabungData(...data) { return data; } console.log(gabungData("HTML", "CSS", "JavaScript")); |
Output:
["HTML", "CSS", "JavaScript"] |
3. Membuat Daftar Nama
Fitur ini juga bisa dipakai untuk menerima banyak nama sekaligus. Semua nama akan tersimpan dalam bentuk array sehingga mudah ditampilkan kembali. Penggunaan seperti ini sering ditemukan saat mengelola data pengguna.
function daftarNama(...nama) { console.log(nama); } daftarNama("Andi", "Budi", "Citra"); |
Output:
["Andi", "Budi", "Citra"] |
4. Mengambil Sisa Parameter
Rest parameter dapat digunakan setelah parameter utama untuk menangkap sisa data. Cara ini berguna ketika fungsi memiliki parameter wajib dan parameter tambahan. Penulisan seperti ini membuat struktur fungsi lebih jelas.
function contoh(a, b, ...lainnya) { console.log(lainnya); } contoh(1, 2, 3, 4, 5); |
Output:
[3, 4, 5] |
5. Menghitung Total Belanja
Dalam kasus sederhana seperti total belanja, rest parameter membantu menerima banyak harga barang sekaligus. Semua harga dapat dijumlahkan tanpa perlu membuat banyak parameter manual. Teknik ini membuat kode lebih singkat dan mudah dibaca.
function totalBelanja(...harga) { return harga.reduce((total, item) => total + item, 0); } console.log(totalBelanja(5000, 10000, 15000)); |
Output:
30000 |
Baca juga: Rekomendasi Kursus Full Stack Developer: Manfaat & Benefit
Perbedaan Rest Parameter dan arguments
Sumber: Canva
Setelah memahami contoh penggunaannya, penting juga untuk tahu bahwa rest parameter berbeda dengan arguments. Keduanya memang bisa digunakan untuk menangani banyak argumen, tetapi cara kerja dan bentuk datanya tidak sama.
1. Bentuk Data
Rest parameter menghasilkan array asli yang bisa langsung menggunakan method array. Sementara itu, arguments berbentuk object mirip array. Karena itu, rest parameter lebih praktis untuk mengolah data.
Contoh rest parameter:
function jumlah(...angka) { return angka.reduce((total, nilai) => total + nilai, 0); } console.log(jumlah(1, 2, 3)); |
Contoh arguments:
function jumlah() { console.log(arguments); } jumlah(1, 2, 3); |
2. Cara Penulisan
Rest parameter ditulis langsung di bagian parameter fungsi dengan tanda tiga titik, seperti ...args.
Sedangkan arguments tidak perlu ditulis di parameter karena sudah tersedia otomatis di dalam function biasa. Dari sisi keterbacaan, rest parameter lebih jelas dan mudah dipahami.
Contoh rest parameter:
function tampilkanData(...data) { console.log(data); } tampilkanData("HTML", "CSS", "JavaScript"); |
Contoh arguments:
function tampilkanData() { console.log(arguments); } tampilkanData("HTML", "CSS", "JavaScript"); |
3. Penggunaan pada Arrow Function
Rest parameter bisa digunakan pada function biasa maupun arrow function. Berbeda dengan itu, arguments tidak tersedia di dalam arrow function.
Jadi, jika warga bimbingan memakai arrow function, rest parameter adalah pilihan yang lebih tepat.
Contoh rest parameter pada arrow function:
const daftarNama = (...nama) => { console.log(nama); }; daftarNama("Andi", "Budi", "Citra"); |
Contoh arguments pada function biasa:
function daftarNama() { console.log(arguments); } daftarNama("Andi", "Budi", "Citra"); |
Siap Berkarier sebagai Full Stack Web Developer?
Setelah belajar rest parameter JavaScript, kamu sudah selangkah lebih dekat untuk memahami dasar pemrograman web. Tapi, untuk menjadi developer profesional, kamu juga perlu menguasai frontend, backend, database, hingga deployment.
Yuk, gabung Bootcamp Full Stack Web Developer di Dibimbing! Kamu akan belajar dengan kurikulum praktis, studi kasus nyata, dan bimbingan mentor berpengalaman.
Dengan dukungan 840+ hiring partner dan tingkat keberhasilan alumni 96%, peluangmu untuk masuk ke industri teknologi jadi semakin besar.
Daftar sekarang disini dan mulai perjalananmu menjadi Full Stack Web Developer profesional. #BimbingSampeJadi!
FAQ
1. Apa itu rest parameter di JavaScript?
Rest parameter adalah fitur JavaScript yang digunakan untuk menampung banyak argumen dalam satu array menggunakan sintaks ....
2. Apa perbedaan rest parameter dan arguments?
Rest parameter menghasilkan array asli, sedangkan arguments hanya object mirip array dan tidak mendukung method array secara langsung.
3. Kapan rest parameter digunakan?
Rest parameter digunakan ketika jumlah argumen pada fungsi tidak pasti atau bisa berubah-ubah.
4. Apakah rest parameter bisa digunakan di arrow function?
Ya, rest parameter bisa digunakan di arrow function dan sering dipakai sebagai pengganti arguments yang tidak tersedia di arrow function.
Irhan Hisyam Dwi Nugroho
Irhan Hisyam Dwi Nugroho is an SEO Specialist and Content Writer with 4 years of experience in optimizing websites and writing relevant content for various brands and industries. Currently, I also work as a Content Writer at Dibimbing.id and actively share content about technology, SEO, and digital marketing through various platforms.
