Cara Menggunakan Map, Filter dan Reduce pada Javascript

Hallo teman-teman semuanya kembali lagi bersama dengan saya di blog kita bersama, kali ini kita akan membahas mengenai cara menggunakan Map, Filter dan Reduce pada javascript

untuk penjelasan silahkan simak penjelasan berikut  :

1. Penggunaan Map

Map adalah salah satu function pada javascript yang berfungsi sebagai pemetaan ulang suatu array pada javascript, dimana jika kita menggunakan function ini maka kita dapat membuat sebuah array baru dari array utama yang sudah kita tentukan, berikut contoh source codenya 

map.js


let deskripsi = ["Cakdun Blog","Cakdun Site", "Jasa Website","Programer"];

let hasilMap = deskripsi.map(value => ({
deksripsi:value,
panjang_string : value.length
}));


console.table(hasilMap);


Output


Keterangan :
Pada program diatas kita akan memetakan ulang, array utama yang sudah kita buat, yang dimana kita sebut dengan array deskripsi, nahh array deskripsi ini akan kita petakan ulang menjadi sebuah array baru dengan menampilkan deskripsi dan panjang string dari deskripsi tersebu  ( lihat di gambar output diatas )


2. Penggunaan Filter


Filter merupakan sebuah function pada javascript yang berfungsi untuk menyaring sebuah nilai yang kita inginkan dalam sebuah array javascript

Contoh Source Code :


let deskripsi = ["Cakdun Blog","Cakdun Site", "Jasa Website","Programer"];

// fungsi Filter
let hasilFilter = deskripsi.filter(values => {
return values.includes("Cakdun");
})

console.table(hasilFilter);


Ouput :



Keterangan :

Pada Potongan Program diatas kita akan memfilter sebuah nilai dalam array deskripsi, yang ingin kita filter adalah deskripsi yang berjudul Cakdun, dan secara otomatis Filter akan menyaring deskripsi yang berhubungan dengan judul Cakdun


3. Penggunaan Reduce

Reduce Merupakan Sebuah Function pada javascript yang berfungsi untuk melakukan sesuatu pada seluruh elemen array 

contoh source code :


// fungsi Reduce
let angka = [1,2,3.4,2,3,4.5,6];

const hasil = angka.reduce((param_1,param_2) => param_1 * param_2);
console.log(hasil);


Output

1101.6


Keterangan :

Pada potongan program diatas kita akan mengkalikan seluruh angka yang terdapat dalam sebuah array, sehingga menghasilkan hasil seperti pada output diatas, pada function Reduce ini memiliki 2 parameter yang dimana 

Param_1 biasa disebut dengan accumulator, yang dimana accumulator ini berfungsi sebagai hasil dari pada operasi yang ingin kita jalankan pada function reduce 

sebagai contoh pada program diatas kita akan mengkalikan seluruh angka di dalam array nahh accumulator akan bertindak sebagai hasil dari operasi perkalian yang kita inginkan

Param_2 biasa disebut dengan Current Value, yang artinya menyimpan value dari nilai dalam array 


4. Bonus

Chaining

chaining merupakan sebuah metode yang menggabungkan beberapa function pada javacript, atau bisa kita sebut dengan method berantai 

contoh source code

let angka2 = [1,2,3.4,2,3,4.5,6];

// chaining method
const hasil2 = angka2.filter(a => a > 2).map(a => a * 2).reduce((a,b)=> a+b);

console.log(hasil2);


Output :

33.8


Keterangan :

Pada potongan program diatas kita akan menggabungkan function map, filter dan reduce dalam satu baris code, yang dimana untuk proses chaining ini kita hanya menggunakan ( . ) dalam penggabungan semua function, nahh penulisan code seperti ini lah biasa kita sebut dengan Chaining

Nahh sekian penjelasan mengenai cara peggunaan dari Map, Filter dan Reduce Pada Javascript, Semoga tutorial ini membantu teman-teman semuanya ...

sekian dan terimakasih...

















0 Komentar