#7 - Cara Menulis JavaScript: Catatan untuk Pemula

Posted by Mukhlis MJ 7/16/2025 Post a Comment

“JavaScript adalah bahasa pemrograman yang membuat website menjadi hidup. Tapi sebelum bikin website yang ‘hidup’, kita harus tahu dulu cara menulisnya, kan?”

Kalau kamu baru belajar JavaScript dan belum tahu harus mulai dari mana, kamu sedang berada di artikel yang tepat. Di sini, kita akan belajar cara menulis JavaScript dari nol, langkah demi langkah. Bahasannya ringan, cocok untuk pemula, dan tentu saja langsung bisa kamu praktikkan.

Apa Itu JavaScript?

JavaScript adalah bahasa pemrograman yang digunakan untuk menambahkan interaktivitas pada halaman web. Contohnya:

Tombol yang bisa diklik
Formulir yang bisa dicek sebelum dikirim
Animasi
Games

Alat yang Dibutuhkan

Untuk menulis JavaScript, kamu hanya perlu:

Teks Editor: seperti VS Code atau Notepad++
Browser: Chrome, Firefox, Edge, atau lainnya

Note: JavaScript tidak perlu di-compile. Cukup buka lewat browser.

Menulis JavaScript: Di Mana?

1. Inline Script

<button onclick="alert('Halo Dunia!')">Klik Saya</button>

2. Di dalam Tag <script>

<script>
  alert("Selamat datang di dunia JavaScript!");
</script>

3. File JavaScript Terpisah

script.js

alert("Halo dari file terpisah!");

Lalu hubungkan ke HTML:

<script src="script.js"></script>

Dasar-Dasar Penulisan JavaScript

1. Menampilkan Output

console.log()

console.log("Hello world!");

alert()

alert("Selamat datang!");

2. Variabel

let nama = "Mukhlis";
const umur = 25;

console.log(nama);
console.log(umur);

3. Tipe Data

let nama = "Mukhlis";    // string
let umur = 25;           // number
let aktif = true;        // boolean
let kosong = null;       // null
let belumIsi;            // undefined

4. Operator

let a = 10;
let b = 5;

console.log(a + b); // 15
console.log(a > b); // true

5. Percabangan (if-else)

let nilai = 80;

if (nilai >= 75) {
  console.log("Lulus!");
} else {
  console.log("Tidak lulus.");
}

6. Perulangan (Loop)

for (let i = 1; i <= 5; i++) {
  console.log("Angka ke-" + i);
}

7. Fungsi

function sapa(nama) {
  console.log("Halo " + nama);
}

sapa("Mukhlis");

Tips Menulis JavaScript

Gunakan console.log() untuk debugging
Gunakan let dan const, hindari var
Gunakan titik koma ; walaupun opsional
Gunakan nama variabel yang jelas
Latihan dan eksperimen setiap hari

Contoh Kasus: Kalkulator Tambah

<!DOCTYPE html>
<html>
<body>
  <h2>Kalkulator Tambah</h2>
  <input id="angka1" type="number" placeholder="Angka pertama">
  <input id="angka2" type="number" placeholder="Angka kedua">
  <button onclick="tambah()">Hitung</button>
  <p>Hasil: <span id="hasil"></span></p>

  <script>
    function tambah() {
      let a = parseFloat(document.getElementById("angka1").value);
      let b = parseFloat(document.getElementById("angka2").value);
      let hasil = a + b;
      document.getElementById("hasil").textContent = hasil;
    }
  </script>
</body>
</html>

Apa Selanjutnya?

Pelajari DOM (Document Object Model)
Pelajari Event Handling
Buat mini project seperti to-do list atau kuis

Kesimpulan

Belajar JavaScript tidak harus rumit. Yang penting kamu paham dulu dasarnya seperti:

Menulis kode JavaScript dengan benar
Mengenal variabel dan tipe data
Menggunakan operator, percabangan, perulangan
Membuat fungsi

Dengan fondasi ini, kamu sudah punya bekal untuk melangkah lebih jauh.

“Kalau kodenya error, jangan panik. Itu tandanya kamu sedang belajar.”

Kalau kamu suka artikel ini, bookmark dan bagikan ke teman-temanmu yang juga ingin belajar JavaScript ya!