Javascript Game #4: Jurus #2 - Si Angka Kuat dan Si Kata Sakti (Tipe Data)

Javascript Game #4:
Jurus #2: Si Angka Kuat dan Si Kata Sakti (Tipe Data)

😂 Joke pembuka: "Kenapa angka 10 takut sama angka 7? Soalnya 7 8 9 (seven eight nine)!" - Jokes Matematika Coding

Halo jagoan JavaScript! Di episode kemarin kita udah punya kotak ajaib (variabel). Nah, sekarang kita bakal belajar ISI dari kotak itu. Ternyata, komputer itu pintar, dia bisa bedain mana angka buat berhitung dan mana tulisan buat ngomong. Ini dia yang namanya TIPE DATA.

💪 ANGKA

🔢 1 2 3

Buat hitung skor, nyawa, posisi, kecepatan. Kuat dan perkasa!

✨ KATA SAKTI

📝 A B C

Buat nama pemain, pesan selamat, dialog game. Bisa digabung-gabung!

TIPE DATA NUMBER (ANGKA)

Kalau di JavaScript, angka itu nggak pake tanda petik. Langsung tulis aja angkanya. Bisa bulat, bisa pecahan (desimal).

// Contoh Number
let skor = 100;
let nyawa = 3;
let kecepatan = 5.5; // angka desimal
let suhu = -10; // boleh negatif

console.log(skor + nyawa); // 103 → dijumlah
console.log(skor * kecepatan); // 550 → dikali

✨ TIPE DATA STRING (KATA/KALIMAT)

String itu deretan huruf, angka, atau simbol. Harus diapit tanda petik (" " atau ' '). Bebas!

// Contoh String
let namaPemain = "Budi";
let pesan = 'Selamat datang di game!';
let kombinasi = "Skor: 100"; // ini tetap string karena ada petik
let angkaJadiString = "123"; // ini string, bukan angka!

console.log(namaPemain + " " + pesan); // menggabung string

😂 Joke: "String itu kayak permen yupi, bisa digabung-gabung jadi panjang. Kalau angka kayak coklat, bisa dimakan (dihitung)!" - Juru Masak Coding

⚠️ HATI-HATI! ANGKA PAKE PETIK JADI STRING!

Kalau kamu tulis angka pakai petik, misal "10", itu bukan angka! Itu teks. Jadi kalau dijumlah: "10" + "5" = "105" (bukan 15). Awas terkecoh!

let angkaBeneran = 10;
let angkaPalsu = "10";

console.log(angkaBeneran + 5); // 15 (bener)
console.log(angkaPalsu + 5); // "105"? WAW! Ternyata digabung jadi string.

⚡ LABORATORIUM ANGKA VS KATA ⚡

Mainkan tombol di bawah dan lihat hasilnya! Buka juga Console (F12) biar liat lebih detail.

Hasil akan muncul di sini...

Lihat juga di console (F12) untuk penjelasan lebih lanjut.

CONTOH LENGKAP DALAM GAME

Di game, kita butuh angka dan string. Simak contoh kode berikut yang bisa kamu coba di file HTML-mu sendiri.

<script>
  // Data pemain
  let nama = "Kancil";
  let skor = 0;
  let nyawa = 3;
  let pesan = "Selamat bermain, " + nama + "!";

  // Tampilkan di alert
  alert(pesan);

  // Skor bertambah 10
  skor = skor + 10;

  // Gabungkan angka ke dalam kalimat
  let laporan = "Skor kamu sekarang " + skor + " dan nyawa " + nyawa;
  console.log(laporan);

  // Tulis ke halaman
  document.write("<h2>" + laporan + "</h2>");
</script>

😂 Joke tambahan: "String kalau ditambah string jadi panjang. Angka kalau ditambah angka jadi besar. Tapi string ditambah angka? Jadi kode rahasia alien 👽!"

KONVERSI TIPE DATA

Kadang kita perlu mengubah string menjadi angka (biar bisa dihitung) atau sebaliknya. Ini caranya:

let angkaString = "250";
let angkaBener = Number(angkaString); // ubah ke angka

let nilai = 100;
let teksNilai = String(nilai); // ubah ke string

console.log(angkaString + 50); // "25050" (string)
console.log(angkaBener + 50); // 300 (angka)

MISI JAGOAN TIPE DATA

1. Buat file HTML baru: tipe_data_ku.html.
2. Di dalam tag <script>, buat variabel berikut:
   • let namaHero = "..." (string)
   • let umurHero = ... (number)
   • let skorHero = 0 (number)
   • let kataSambutan = "Halo, " + namaHero + "!" (string)
3. Tampilkan kataSambutan dengan alert().
4. Tambah skorHero dengan 50, lalu tampilkan pesan "Skor sekarang: " + skorHero di console.
5. Coba buat variabel let angkaPalsu = "100", lalu jumlahkan dengan 20. Lihat hasilnya di console. Kemudian ubah dengan Number(angkaPalsu) dan jumlahkan lagi. Bedakan hasilnya.

📸 Abadikan hasil console-mu dan tunjukkan ke teman!

📝 RANGKUMAN SERU

• Number: angka, bisa dihitung (+, -, *, /).
• String: teks, harus pakai tanda petik. Kalau dijumlah ( + ) jadi digabung.
• Kalau string berisi angka, tetap string, bukan angka.
• Gunakan Number() untuk mengubah string ke angka, String() untuk mengubah angka ke string.

Javascript Game #4 selesai! Besok kita belajar Jurus #3: Fungsi - mesin penjawab cerdas!

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