JavaScript: Fungsi, Arrow Function, dan Scope

Fungsi adalah blok kode yang diberi nama dan bisa dipanggil berulang kali. Fungsi adalah unit terkecil dari abstraksi dalam pemrograman — cara mengelompokkan logika agar tidak perlu ditulis ulang. Di JavaScript, fungsi adalah first-class citizen — bisa disimpan di variabel, dikirim sebagai argumen, dan dikembalikan sebagai nilai.

---

Cara Mendefinisikan Fungsi

Function Declaration

function sapa(nama) {
  return `Halo, ${nama}!`;
}

console.log(sapa("Budi"));   // "Halo, Budi!"
console.log(sapa("Sari"));   // "Halo, Sari!"

Function declaration bisa dipanggil sebelum didefinisikan (hoisting):

console.log(tambah(3, 4));  // 7 — bekerja meskipun fungsi di bawah

function tambah(a, b) {
  return a + b;
}

Function Expression

// Fungsi disimpan di variabel
const kali = function(a, b) {
  return a * b;
};

console.log(kali(4, 5));  // 20

Function expression tidak di-hoist — harus didefinisikan sebelum dipanggil.

Arrow Function (ES6) — Cara Modern

// Format: (parameter) => ekspresi atau { blok kode }

// Satu baris — return implicit
const kuadrat = (n) => n * n;
const salam = nama => `Halo, ${nama}!`;  // satu parameter, () opsional

// Multi baris — perlu return eksplisit
const hitungLuas = (panjang, lebar) => {
  const luas = panjang * lebar;
  return luas;
};

console.log(kuadrat(5));       // 25
console.log(salam("Budi"));    // "Halo, Budi!"
console.log(hitungLuas(4, 6)); // 24

---

Parameter dan Argumen

// Default parameter — nilai jika tidak dikirim
function buat(nama, role = "member", aktif = true) {
  return { nama, role, aktif };
}

console.log(buat("Budi"));               // { nama: "Budi", role: "member", aktif: true }
console.log(buat("Sari", "admin"));      // { nama: "Sari", role: "admin", aktif: true }
console.log(buat("Tono", "guest", false));

// Rest parameter — kumpulkan argumen sisa ke array
function jumlahSemua(...angka) {
  return angka.reduce((total, n) => total + n, 0);
}

console.log(jumlahSemua(1, 2, 3));         // 6
console.log(jumlahSemua(10, 20, 30, 40));  // 100

---

Return Value

// Fungsi bisa return nilai apapun
function cekGenap(n) {
  return n % 2 === 0;  // return boolean
}

function getUser(id) {
  return { id, nama: "Budi" };  // return object
}

// Tanpa return → function mengembalikan undefined
function cetakHalo() {
  console.log("Halo!");
  // tidak ada return
}

const hasil = cetakHalo();
console.log(hasil);  // undefined

---

Scope

Scope menentukan di mana variabel bisa diakses. JavaScript punya beberapa level scope:

Global Scope

const appNama = "Blog Kiki";  // variabel global

function tampilkanNama() {
  console.log(appNama);  // bisa akses variabel global
}

tampilkanNama();  // "Blog Kiki"

Function Scope

function hitungDiskon(harga) {
  const diskon = 0.1;        // hanya ada di dalam fungsi ini
  const hasil = harga * diskon;
  return hasil;
}

// console.log(diskon);  // ReferenceError: diskon tidak terdefinisi

Block Scope (let dan const)

{
  let temp = 100;
  const MAX = 200;
  console.log(temp);  // 100
}

// console.log(temp);  // ReferenceError
// console.log(MAX);   // ReferenceError

Closure — Fungsi yang “Mengingat” Scope-nya

Closure adalah fungsi yang tetap bisa mengakses variabel dari scope tempat ia dibuat, meski scope tersebut sudah selesai:

function buatCounter() {
  let count = 0;  // variabel di outer function

  return function() {
    count++;           // akses variabel dari outer function
    return count;
  };
}

const counter = buatCounter();
console.log(counter());  // 1
console.log(counter());  // 2
console.log(counter());  // 3

const counter2 = buatCounter();
console.log(counter2()); // 1 ← counter baru, independen

Closure sangat berguna untuk enkapsulasi data dan membuat module pattern.

---

Higher-Order Function

JavaScript mendukung fungsi sebagai nilai — bisa dikirim sebagai argumen atau dikembalikan sebagai hasil:

// Fungsi sebagai argumen (callback)
function prosesData(angka, transform) {
  return transform(angka);
}

const duaKali = n => n * 2;
const kuadrat = n => n ** 2;

console.log(prosesData(5, duaKali));  // 10
console.log(prosesData(5, kuadrat));  // 25

// Ini adalah dasar dari map, filter, reduce!
const angka = [1, 2, 3, 4, 5];

const digandakan = angka.map(n => n * 2);
console.log(digandakan);  // [2, 4, 6, 8, 10]

const genap = angka.filter(n => n % 2 === 0);
console.log(genap);       // [2, 4]

const total = angka.reduce((acc, n) => acc + n, 0);
console.log(total);       // 15

---

IIFE — Immediately Invoked Function Expression

Fungsi yang langsung dipanggil saat didefinisikan:

(function() {
  const rahasia = "tidak bisa diakses dari luar";
  console.log("IIFE berjalan!");
})();

// Versi arrow function
(() => {
  console.log("Arrow IIFE");
})();

---

Kesimpulan

Fungsi adalah alat terpenting dalam JavaScript. Dengan memahami function declaration, arrow function, scope, closure, dan higher-order function, kamu sudah siap menulis kode JavaScript yang terstruktur dan maintainable.

Di artikel berikutnya, kita bahas Array dan Object — struktur data utama di JavaScript untuk mengelola kumpulan informasi.