Spreading operator dituliskan dengan three consecutive dots (….). Sesuai namanya “Spread”, Inti nya spread operator ialah pelebur array jadi beberapa elemen yang berbeda fitur baru ES6 ini dipakai untuk membentangkan nilai array atau lebih tepatnya iterable object jadi beberapa elements. Ayo kita lihat contoh kode berikut:
const favorites = [“Seafood”, “Salad”, “Nugget”, “Soup”];
- console.log(favorites);
- /* output:
-
- [ ‘Seafood’, ‘Salad’, ‘Nugget’, ‘Soup’ ]
-
- */
Pada kode itu hasil yang dicetak ialah sebuah array (ditunjukkan dengan tanda [ ]), sebab memang kita mencetak nilai favorites itu sendiri. Nah, dengan memakai spread operator kita bisa membentangkan nilai – nilai dalam array itu.
-
-
- const favorites = [“Seafood”, “Salad”, “Nugget”, “Soup”];
- console.log(…favorites);
- /* output:Seafood Salad Nugget Soup
-
-
- */
Tampak kan perbedaanya? Kenapa bisa demikian? Spread operator bekerja seperti meleburkan nilai array jadi beberapa elemen sesuai dengan panjang nilai array-nya, sehingga bila kita menuliskan kode semacam ini:
- console.log(…favorites);
Sama seperti kita menuliskan kode semacam ini:
- console.log(favorites[0], favorites[1], favorites[2], favorites[3]);
Spread operator ini cocok sekali dipakai sebagai nilai patokan pada variadic functions, seperti console.log() atau Math.max().
-
- /* Math.max() -> Mencari nilai paling besar */
- const numbers = [12, 32, 90, 12, 32];
-
- // Sama seperti kita menuliskan
-
- // console.log(Math.max(numbers[0], numbers[1], numbers[2], numbers[3])
-
- console.log(Math.max(…numbers));
- /* output90
-
- */
Spread operator bisa dipakai untuk menggabungkan dua buah array dalam objek array baru. Bila tidak memakai spread operator ini maka hasilnya semacam ini:
-
- const favorites = [“Seafood”, “Salad”, “Nugget”, “Soup”];
-
- const others = [“Cake”, “Pie”, “Donut”];
-
- const allFavorites = [favorites, others]
-
- console.log(allFavorites);
- /* output:[[ ‘Seafood’, ‘Salad’, ‘Nugget’, ‘Soup’ ], [ ‘Cake’, ‘Pie’, ‘Donut’ ]]
-
- */
Sayang sekali, nilai array tak akan tergabung. Bukannya menggabungkan nilainya, variabel allFavorite jadi objek array baru yang menampung dua array di dalamnya. Nah lalu bagaimana bila kita mencoba memakai spread operator?
-
- const favorites = [“Seafood”, “Salad”, “Nugget”, “Soup”];
-
- const others = [“Cake”, “Pie”, “Donut”];
-
- const allFavorites = […favorites, …others]
-
- console.log(allFavorites);
-
-
- /* output:
- [ ‘Seafood’, ‘Salad’, ‘Nugget’, ‘Soup’, ‘Cake’, ‘Pie’, ‘Donut’ ]
-
-
- */
Yups, dengan memakai spread operator nilai dari dua array itu berhasil tergabung.
