Mari kita lihat cuplikan kode berikut
const arrPertama = ["cuma", "ingin", "nulis"];
const arrKedua = ["halo", "dunia", "javascript"];
for (let counter = 0; counter < arrPertama.length; counter++) {
console.log(arrPertama[counter]);
}
for (let counter = 0; counter < arrKedua.length; counter++) {
console.log(arrKedua[counter]);
}Lalu solusinya bagaimana?
Fungsi adalah suatu cara untuk menuliskan kode yang bisa dipakai berulang-ulang sehingga membuat kode kita menjadi lebih DRY
Prinsip dalam pemrograman yang bertujuan untuk mengurangi perulangan dari pola penulisan kode
Fungsi dapat dideklarasikan dengan menggunakan keyword function
Notasi penulisan fungsi
function namaFungsi() {
// Kode di sini
// ...
}
// Cara memanggil atau menjalankan fungsi
// bahasa kerennya: meng-invoke fungsi
namaFungsi();Contoh Deklarasi Fungsi
// deklarasi
function cetakHaloLimaKali() {
for (let counter = 0; counter < 5; counter++) {
console.log("Halo");
}
}
// invoke
cetakHaloLimaKali();Notasi penulisan fungsi sebagai ekspresi
// Di sini kita menuliskan fungsi ke dalam variabel
// Di sebelah kiri kita menuliskan nama variabel
// Di sebelah kanan kita menuliskan fungsi yang akan didefinisikan
// tanpa nama (anonim) - anonymous function
const namaFungsi = function() {
// Kode di sini
// ...
}
// invoke fungsi
namaFungsi();Contoh Fungsi sebagai eskpresi
// karena fungsi tidak akan berubah
// gunakan const untuk menyimpan fungsi
const fungsiPenjumlahan = function() {
let bilanganPertama = 10; let bilanganKedua = 20;
let jumlah = bilanganPertama + bilanganKedua;
// mengembalikan angka hasil penjumlahan
return jumlah;
}
// invoke fungsi
// fungsiPenjumlahan() akan mengembalikan jumlah
// langsung cetak jumlah melalui console.log
console.log(fungsiPenjumlahan());Parameter adalah nama variabel yang dilempar ke dalam suatu fungsi, sedangkan Argumen adalah nilai asli yang dimasukkan ke dalam fungsi
Notasi Parameter dan Argumen
// jumlah parameter bisa banyak tergantung "koma"-nya
// di sini dideklarasikan dengan nama
// param1 dan param2
const namaFungsi = function(param1, param2) {
// Kode di sini
// ...
}
// invoke fungsi dan lempar (passing) arguments (args)
namaFungsi('arg1', 'arg2');Contoh Parameter dan Argumen
// membuat fungsi pengurangan
const fungsiPengurangan = function(angkaSatu, angkaDua) {
// langsung dihitung pengurangannya
// dan dikembalikan
return angkaSatu - angkaDua;
}
// simpan hasil dan invoke fungsi dengan argumen
// untuk parameter angkaSatu dan angkaDua
// di sini berarti: angkaSatu = 10 dan angkaDua = 20
const hasil = fungsiPengurangan(10, 5);
// cetak hasil-nya
console.log(hasil);Notasi arrow function
// cara penulisan arrow function
const arrowFunction = (param1, param2) => {
// kode di sini
// ...
}
// invoke fungsi
arrowFunction('arg1', 'arg2');Contoh arrow function
// cara penulisan arrow function
const fungsiPerkalian = (angkaSatu, angkaDua) => {
return angkaSatu * angkaDua;
}
// cara penulisan arrow function yang singkat
// cara baca:
// fungsi ini menerima dua parameter - satu dan dua
// fungsi akan mengembalikan - satu dikali dua
const fungsiPerkalianSingkat = (satu, dua) => satu * dua;
// invoke fungsi seperti biasa
console.log(fungsiPerkalian(10, 5));
console.log(fungsiPerkalianSingkat(20,10));Notasi IIFE
// bungkus fungsi anonim dalam ()
// dan langsung diinvoke ()
// double kurung atau ()()
(function () {
// Kode di sini
// ...
})();
// tidak perlu di-invoke lagi
// sudah diinvokeContoh IIFE
// Misalnya fungsi untuk pembagian
(function () {
let a = 30;
let b = 5;
console.log('Hasilnya adalah ' + a / b);
})();
// tidak perlu di-invoke lagi
// sudah diinvokeApa sih kegunaan dari IIFE?