ES2015-Menggunakan Spread Operator

Spread operator merupakan fitur dari ES2015, dapat diimplementasikan menggunakan TypeScript.

Untuk lebih jelas, langsung saja kita gunakan contoh kode:

function add(){

    var values = Array.prototype.splice.call(arguments, [1]), 
        total = 0;

    for (var value of values){
        total += value;
    }

    return total;
}

Jika dengan pendekatan ES5, untuk membuat fungsi yang tidak dibatasi jumlah parameter, diperlukan pendatana yang tricky. Parameter harus dibaca melalui Array.prototype.splice.call, seperti perintah dibawah.

values = Array.prototype.splice.call(arguments, [1])

Fungsi add diatas sekilas membingungkan, karena memanggil fungsi Array dan tidak memiliki argument. Hal ini dapat menyulitkan bila suatu hari terjadi error.

ES2015 menambahkan fitur spread operator untuk menjawab masalah ini.

Buka file app.ts, lalu ubah kode diatas menjadi seperti berikut:

function add(...values){

    var total = 0;

    for (var value of values){
        total += value;
    }

    return total;
}

Perhatian, jika fungsi menerima beberapa parameter, spread operator harus disimpan paling belakang. Berikut contohnya:

function calculate(act, ...values){

    var total = 0;

    for (var value of values){
        switch (act){
            case 'add':
                total += value;
                break;
            case 'sub':
                total -= value;
                break;

        }
        total += 0;
    }

    return total;
}

Selain digunakan sebagai parameter fungsi, spread operator juga dapat digunakan untuk menambahkan suatu array ke array lainnya.

var arr1 = [1, 2, 3];
var arr2 = [0, ...arr1, 4, 5, 6];

atau jika ingin melakukan push array ke array lainnya.

var arr1 = [1, 2, 3];
var arr2 = [4, 5, 6];

#pada ES5
Array.prototype.push.apply(arr1, arr2);

#pada ES2015
arr1.push(..arr2);