← Galeri
Pesan
Demo oleh abcweb.id
Ngoding Santai Tutorial web untuk pemula
Menu

JavaScript Tingkat: Pemula 2 menit baca 3 contoh kode

Fungsi: membungkus langkah agar bisa dipakai ulang

Menulis fungsi dengan parameter dan nilai kembali, mengenal fungsi panah, dan memahami cakupan variabel.

Laras Wulandari Terbit

Seri JavaScript dari nol Bagian 3 dari 4

Lihat semua bagian seri ini
  1. Variabel dan tipe data: menyimpan nilai di JavaScript
  2. Kondisi dan perulangan: membuat kode mengambil keputusan
  3. Fungsi: membungkus langkah agar bisa dipakai ulang (sedang dibaca)
  4. DOM dan event: membuat tombol yang benar-benar bekerja
Daftar isi
  1. Mendeklarasikan dan memanggil
  2. Fungsi panah
  3. Cakupan variabel
  4. Ringkasan
  5. Latihan

Yang akan dipelajari

  • Mendeklarasikan dan memanggil fungsi
  • Parameter dan nilai kembali dengan return
  • Menulis fungsi panah
  • Cakupan variabel di dalam fungsi

Prasyarat

Begitu sebuah langkah dipakai lebih dari sekali, saatnya membungkusnya menjadi fungsi. Fungsi memberi nama pada sekumpulan perintah, sehingga kode lebih pendek dan lebih mudah dibaca.

Mendeklarasikan dan memanggil

Konsol JavaScript 
function luasPersegiPanjang(panjang, lebar) {
  return panjang * lebar;
}

console.log(luasPersegiPanjang(4, 3)); // 12
console.log(luasPersegiPanjang(10, 2)); // 20

panjang dan lebar disebut parameter: nama sementara untuk nilai yang dikirim saat fungsi dipanggil. Kata kunci return mengembalikan hasil ke tempat fungsi dipanggil dan sekaligus menghentikan fungsi.

Fungsi panah

Ada cara tulis yang lebih ringkas, disebut fungsi panah. Untuk fungsi satu baris, kurung kurawal dan return boleh dihilangkan.

Konsol JavaScript 
const sapa = (nama = 'teman') => 'Halo, ' + nama + '!';

console.log(sapa('Rani')); // Halo, Rani!
console.log(sapa());       // Halo, teman!

Contoh ini juga memakai nilai bawaan parameter: bila nama tidak diisi, dipakai 'teman'.

Cakupan variabel

Variabel yang dibuat di dalam fungsi hanya dikenal di dalam fungsi itu. Ini mencegah nama variabel di satu fungsi bertabrakan dengan fungsi lain.

Konsol JavaScript 
function hitungDiskon(harga) {
  const potongan = harga * 0.1;
  return harga - potongan;
}

console.log(hitungDiskon(50000)); // 45000
console.log(typeof potongan);     // undefined

Ringkasan

  • Fungsi membungkus langkah agar bisa dipanggil berulang.
  • Parameter menerima masukan; return mengembalikan hasil.
  • Fungsi panah adalah cara tulis ringkas untuk fungsi.
  • Variabel di dalam fungsi tidak dikenal di luar fungsi.

Latihan

Kerjakan tanpa melihat contoh dulu. Buntu itu wajar; intip seperlunya.

  1. Tulis fungsi kelilingPersegi(sisi) yang mengembalikan keliling persegi.
  2. Ubah luasPersegiPanjang menjadi fungsi panah.
  3. Tulis fungsi apakahGenap(angka) yang mengembalikan true atau false.

Ditulis oleh Laras Wulandari

Penulis JavaScript · 5 tutorial

Pernah mengajar kelas komputer untuk remaja di balai warga. Percaya bahwa konsep paling rumit pun bisa dijelaskan dengan contoh sehari-hari, asal contohnya benar-benar dijalankan dulu.

Tutorial lain dari Laras

Tutorial terkait