Javascript Game #5: Jurus #3 - Mesin Penjawab Cerdas si Komputer (Fungsi)

Javascript Game #5:
Jurus #3: Mesin Penjawab Cerdas si Komputer (Fungsi)

😂 Joke pembuka: "Fungsi itu kayak pacar: kalau dipanggil, dia datang. Tapi kalau lupa kasih tanda kurung, dia nggak muncul-muncul!" - Programmer Galau 2024

Hai para calon programmer hebat! Di episode sebelumnya kita punya kotak ajaib (variabel) dan isi kotak (tipe data). Sekarang kita akan belajar mesin ajaib yang bisa menjalankan perintah berulang-ulang tanpa nulis ulang. Namanya FUNGSI!

🧃

BLENDER AJAIB

Masukkan buah (input), tekan tombol, keluar jus (output). Fungsi itu seperti blender!

🧾

RESEP MASAK

Resep bisa dipakai berkali-kali. Fungsi itu resep untuk komputer.

CARA MEMBUAT FUNGSI (MESIN AJAIB)

Gunakan kata kunci function, kasih nama, lalu tulis perintah di dalam kurung kurawal { }.

// Membuat fungsi sederhana
function sapaTeman() {
  console.log("Halo teman-teman!");
  alert("Selamat datang di game seru!");
}

// Memanggil fungsi (menjalankan mesin)
sapaTeman(); // Nanti muncul alert dan console
😂 Joke: "Kalau lupa panggil fungsi, dia ngambek. Kayak kamu manggil teman tapi cuma dibisikin, nggak kedengeran!"

FUNGSI DENGAN INPUT (PARAMETER)

Kadang mesin butuh bahan. Misal blender butuh buah. Nah, kita kasih input ke fungsi.

// Fungsi dengan parameter (input)
function sapaNama(nama) {
  console.log("Halo, " + nama + "! Semangat coding!");
}

sapaNama("Budi"); // Output: Halo, Budi!
sapaNama("Siti"); // Output: Halo, Siti!
sapaNama("JavaScript"); // Output: Halo, JavaScript!

FUNGSI YANG MENGEMBALIKAN HASIL (RETURN)

Ada fungsi yang ngasih hasil. Misal mesin jus, kita kasih buah, dia keluarin jus. Pakai return.

// Fungsi dengan return
function tambahSkor(skorSekarang, tambahan) {
  let skorBaru = skorSekarang + tambahan;
  return skorBaru; // mengembalikan hasil
}

let skorku = 100;
skorku = tambahSkor(skorku, 50); // skorku jadi 150
console.log(skorku);

⚙️ LABORATORIUM MESIN FUNGSI ⚙️

Pencet tombol di bawah untuk menjalankan fungsi. Buka console (F12) juga ya!

Klik tombol untuk melihat hasil

CONTOH FUNGSI DI GAME

Bayangkan kita bikin game. Kita bisa bikin fungsi untuk tambah skor, kurang nyawa, tampilkan pesan, dll.

// Fungsi-fungsi dalam game
let skor = 0;
let nyawa = 3;

function tambahSkor(poin) {
  skor = skor + poin;
  console.log("Skor sekarang: " + skor);
}

function kurangiNyawa() {
  nyawa = nyawa - 1;
  if (nyawa <= 0) {
    console.log("Game Over!");
  } else {
    console.log("Nyawa sisa: " + nyawa);
  }
}

function tampilkanStatus() {
  return "Skor: " + skor + ", Nyawa: " + nyawa;
}

// Panggil fungsi
tambahSkor(100);
kurangiNyawa();
console.log(tampilkanStatus());
😂 Joke fungsi: "Kenapa fungsi suka begadang? Soalnya dia nggak bisa return (pulang) sebelum tugasnya selesai!"

PRAKTEK LANGSUNG BUAT FUNGSI SENDIRI

Buka console (F12) di browser, lalu ketik kode berikut dan lihat hasilnya.

// Ketik di console satu per satu, lalu enter
function kaliDua(angka) { return angka * 2; }
kaliDua(5); // 10
kaliDua(100); // 200

function ucapkanHalo(nama) { console.log("Halo " + nama + ", selamat belajar!"); }
ucapkanHalo("Jagoan Coding");

MISI JAGOAN FUNGSI

  1. Buat file HTML baru: fungsi_ku.html.
  2. Di dalam <script>, buat fungsi bernama salamPagi yang menampilkan alert "Selamat pagi, semangat coding!".
  3. Panggil fungsi itu.
  4. Buat fungsi hitungKelereng dengan parameter jumlah, lalu return hasil jumlah * 3.
  5. Panggil fungsi itu dengan angka 5, tampilkan hasilnya dengan console.log.
  6. Buat fungsi buatKalimat yang menerima nama dan umur, lalu mengembalikan teks "Halo, nama saya [nama], umur [umur] tahun."
  7. Panggil fungsi itu dengan data kamu.

📸 Minta tolong orang tua foto hasil coding-mu dan simpan!

📝 RANGKUMAN SERU

  • Fungsi adalah mesin ajaib yang bisa dipanggil kapan saja.
  • Buat fungsi dengan function namaFungsi() { perintah }.
  • Fungsi bisa menerima input (parameter).
  • Fungsi bisa mengembalikan hasil (return).
  • Dengan fungsi, kita tidak perlu menulis kode berulang-ulang.

Javascript Game #5 selesai! Besok kita belajar Jurus #4: Komputer Pintar Pilih-pilih (If/Else). Siap-siap!

Ada pertanyaan? Tulis di komentar atau tanya kakak/guru.

Lebih baru Lebih lama

نموذج الاتصال