Fungsi Pada Array di JavaScript ES6 – JavaScript ES6 #6

Fungsi Pada Array di JavaScript ES6

Sebelumnya sudah ada fungsi-fungsi (method) yang ada pada JavaScript secara default.

Pada JavaScript ES6, ada beberapa penambahan metode-metode atau fungsi baru ditambahkan pada JavaScript untuk memaniplulasi array, sesuai dengan kebutuhan terkini dari JavaScript yang implementasinya semakin luas.

Berikut adalah fungsi-fungsi baru yang ditambahkan pada array di JavaScript versi ES6 beserta dengan contoh penggunaannya masing-masing

Mengubah String ke Array

Berikut adalah contoh kode untuk konversi menjadi array menggunakan versi ES5.

// ES5

var string = "Hello World";

// konversi string menjadi array
var array = string.split("");

console.log(array); // output: ["H", "e", "l", "l", "o", " ", "W", "o", "r", "l", "d"]

Pada contoh diatas terlihat bahwa kita memakai method split() untuk konversi string ke array dan parameternya diberikan tanda kutip dua.

Berikut adalah contoh konversi string ke array pada ES6.

// ES6

const string = "Hello World";

const array = Array.from(string);

console.log(array); // output: ["H", "e", "l", "l", "o", " ", "W", "o", "r", "l", "d"]

Kita menggunakan method from() untuk melakukan konversi ke array. Method form() bisa juga diterapkan pada data yang iterable lainnya.

Perulangan pada Array Menggunakan Continue dan Break 

Berikut adalah contoh perulangan dalam array, pada ES5 kita menggunakan for seperti biasanya, dimana pada parameter for ada inisialisasi awal variabel i hingga increment.

Namun pada ES6 kita menggunakan perulangan for…of dengan penulisan lebih singkat dari perulangan sebelumnya.

// ES5

for (var I = 0; I < boxesArr.length; i++) {
    if (boxesArr[i].className === ‘box blue’){
        continue;
    }

    boxesArr[i].textContent = ‘I changed to blue’;
}

// ES6

for (const cur of BoxesArr6) {
    if (cur.className.include(‘box blue’)){
        continue;
    }

    cur.textContent = ‘I changed to blue’;
}

Fungsi Find Index untuk Mencari Index dari Sebuah Nilai

Pada ES5 untuk menemukan index kita menggunakan method indexOf(), namun pada ES6 kita bisa gunakan method berikut untuk menemukan index dan isi index pada sebuah array.

• Function findIndex() mengembalikan indek pada array sesuai dengan ketentuan pada parameternya.
• Function find() mirip seperti findIndex(), tetapi yang dikembalikan oleh find() adalah value pada array.

Berikut adalah contoh penerapan method diatas dalam kode.

var ages = [12, 18, 10, 19, 14, 11];

// ES5

var full = ages.map( function (cur) {
    return cur >= 18;
});

console.log(full); // akan menampilkan [false, false, false, true, false, false,]

console.log(full.indexOf(true)); // akan menampilkan 3
console.log(ages[full.indexOf(true)]); // akan menampilkan 19

// ES6

console.log(ages.findIndex( cur => cur >= 18)); // akan menampilkan 3

console.log(ages.find( cur => cur >= 18)); // akan menampilkan 19

Fungsi untuk Menyalin Elemen dari Sebuah Array

const fruits = ['apple', 'banana', 'cherry', 'date', 'elderberry'];

fruits.copyWithin(2, 0, 2);

console.log(fruits); // ['apple', 'banana', 'apple', 'banana', 'elderberry']

const arr1 = Array.of(1, 2, 3, 4);
console.log(arr1); // [1, 2, 3, 4]

const arr2 = Array.of('a', 'b', 'c');
console.log(arr2); // ['a', 'b', 'c']

var warna = ["Merah", "Kuning", "Biru", "Hitam"];
var iterator = warna.entries();

for (i of iterator) {
    console.log(i); 
}

// menampilkan:
// [ 0, 'Red' ]// [ 1, 'Yellow' ]// [ 2, 'Blue' ]// [ 3, 'Black' ]