Spread Operator di JavaScript

Spread Operator di JavaScript – JavaScript ES6 #7

1.2K views
2 minute read

10 Maret 2023

Spread operator berfungsi untuk memisakan sebuah array menjadi sebuah komponen tunggal dari masing-masing elemen yang ada di array tersebut.

Dengan menggunakan spread operator, kita juga bisa menggabungkan dua buah array menjadi satu buah array.

Penggunaan Spread Operator di JavaScript

Misalnya memiliki sebuah fungsi untuk mengitung total nilai rata-rata dari sebuah kelompok mahasiswa yang terdiri dari 5 orang seperti berikut:

function hitungNilai(a, b, c, d, e) {

     return a + b + c + d + e;

}

Pada fungsi diatas, parameter yang dibutuhkan adalah variabel dari masing-masing anggota kelompok.

Namun bagaimana jika struktur data yang kita miliki adalah sebuah array yang berisi nilai-nilai dari masing-masing anggota kelompok seperti berikut:

var nilaiAnggota = [70, 80, 65, 70, 90];

Pada ES5 mungkin kita bisa menggunakan fungsi “apply” untuk mengatasi hal ini, kita bisa memisahkan array tersebut dengan menggunakan fungsi “apply” agar bisa dioper pada fungsi menghitung total nilai, seperti berikut:

var nilaiKelompok = hitungNilai.apply(null, nilaiAnggota);

console.log(nilaiKelompok);

Namun pada ES6, dengan adanya fitur baru yaitu spread operator kita bisa melakukan hal ini dengan lebih mudah.

Hanya dengan menggunakan spread operator, array tersebut akan secara otomatis dipisahkan menjadi komponen tunggal tanpa perlu lagi menggunakan seperti berikut:

let nilaiKelompok = hitungNilai(...nilaiAnggota);

console.log(nilaiKelompok);

Cukup hanya dengan potongan kode seperti diatas kita sudah berhasil memisahkan masing-masing elemen dari array tersebut dan dioper sebagai variabel-variabel pada fungsi menghitung nilai.

Menggunakan spread operator jauh lebih simpel dan mudah dibaca dibandingkan dengan harus menggunakan fungsi “apply” seperti yang harus dilakukan dengan cara sebelumnya.

Menggabungkan Beberapa Array Menggunakan Spread Operator

Dengan menggunakan spread operator kita juga bisa menggabungkan beberapa array ke dalam sebuah array yang baru dengan lebih mudah.

Misalnya kita memiliki beberapa array seperti berikut:

let nilaiKelompok1 = [70, 60, 80, 70, 90];

let nilaiKelompok2 = [80, 65, 60, 70, 80];

let nilaiKelompok3 = [75, 60, 60, 80, 70];

Kita bisa dengan mudah menggabung lebih buah array tersebut menjadi sebuah array dengan menggunakan spread operator seperti berikut:

let nilaiKelas = [...nilaiKelompok1, ...nilaiKelompok2, ...nilaiKelompok3];

Spread operator pada JavaScript ES6 sangat membantu untuk mempermudah menulis program menggunakan JavaScript.

Spread Operator di JavaScript – JavaScript ES6 #7