Mengenal Arrow Function pada Javascript

Kali ini MID Teknologi akan membahas tentang salah satu fitur terbaru Arrow Function pada Javascript yaitu , arrow function adalah sintaks penulisan function pada javascript dengan kode yang lebih ringkas yaitu dengan menggunakan token ‘=>'.

Arrow sendiri datang bersama fitur dari ES6, bagi yang belum tau apa itu ES6. ES6 adalah sebuah standarisasi scripting (javascript) yang dibuat oleh European Computer Manufacturers Association (ECMA).

Dengan menggunakan function arrow kita bahkan tidak perlu menginisialisasi function,nama function dan return karena sifatnya yang anonim.

Arrow Function pada Javascript

biasanya saat kita akan mendeklarasikan sebuah function pada javascript kita akan memulainya dengan sebuah variable atau menginisialisasi nama sebuah function lalu memasukan parameter apa saja yang akan diperlukan dan memulai proses didalam kurung kurawal seperti blok kode dibawah.

//sintaks javascript pada umumnya
var hello1 = function(nama){
    console.log("selamat datang"+nama);
}
function hello2 (nama,nama2){
    console.log("selamat datang "+nama+" dan "+nama2);
}

hello1("andi");
hello2("Rifaldy","andi");

namun dengan menggunakan fitur dari EcmaScript6 kita bisa meringkas kode tersebut menjadi lebih sederhana dari blok kode diatas.

// function dengan 1 parameter
var hello1 = nama => {console.log('selamat datang $(nama)')}
//function dengan lebih dari 1 parameter
var hello2 = (nama,nama2)=> {console.log('selamat datang $(nama) dan $(nama2)'}
//function tanpa parameter
var hello3 = () => {console.log("selamat datang di website saya")}

hello1("andi");
hello2("Rifaldy","andi");
hello3();

pada block kode diatas ada 3 contoh penggunaan arrow, dimana pada penggunaannya arrow tidak memerlukan kunci function di depannya dan langsung mendeklarasikan parameter yang dibutuhkan.

jika parameter yang dibutuhkan hanya 1 maka kita bisa meringkasnya kembali dengan menghilangkan tanda kurung pada baris kode tersebut.

namun jika kita tidak memiliki parameter yang dibutuhkan maka kita teap harus menggunakan tanda kurung agar block kodenya dapat berjalan dengan benar.

selain itu jika kita hanya akan menjalankan 1 perintah di dalam function maka kita tidak perlu menggunakan kurung kurawal “{}”.

baca : perbedaan var let const

//tidak perlu {}
var tampil = nama => console.log('selamat datang di website saya $(nama)');
//perlu {}
var tampil2 = nama =>{
    if(nama === "admin"){
       console.log("selamat datang di page admin");
  }else{
       console.log("selamat datang di page member");
  }
}

dengan menggunakan arrow function pada javascript kita bisa lebih menghemat waktu pada saat mendevelop sebuah script javascript, selain itu arrow function ini juga akan sangat berguna saat kita membuat aplikasi web/android menggunakan framework javascript, seperti React dan React native nantinya.

Selain arrow function pada javascript ES6 juga hadir dengan membawa beberapa fitur baru pada javscript yang akan kita bahas di tutorial berikutnya.

Untuk lebih lengkap tetang arrow function pada javascript kamu bisa mencobanya di w3School

nantinya pada javascript akan sangat terpakai saat kita menggunakan react js.

baca : apa itu react js

Sementara itu dulu yang bisa MID Teknologi sampaikan mengenai pengenalan arrow function pada javascript, Terimakasih.