Belajar Javascript Dasar – Mengenal Apa Itu Javascript?

Kalau kamu ingin punya skill yang “kepakai di mana-mana” untuk web, Belajar JavaScript adalah pilihan yang sangat masuk akal. JavaScript dipakai untuk membuat website jadi interaktif, dari hal sederhana seperti tombol dan validasi form, sampai aplikasi web besar seperti dashboard, toko online, dan aplikasi berbasis single page.

Di Part 1 ini kita fokus pada fondasi. Targetnya bukan langsung jago, tapi paham konsep yang paling penting supaya kamu tidak bingung saat lanjut ke materi berikutnya. Setelah selesai, kamu akan mengerti apa itu JavaScript, kenapa penting untuk pemula, cara kerjanya di browser, dasar sintaks, dan cara mulai latihan dengan benar.

Apa Itu JavaScript?

JavaScript adalah bahasa pemrograman yang digunakan terutama untuk membuat halaman web menjadi interaktif.

Kalau dianalogikan:

• HTML adalah struktur atau kerangka halaman.
• CSS adalah tampilan dan gaya.
• JavaScript adalah logika dan perilaku.

Dengan JavaScript, kamu bisa membuat fitur seperti:

• tombol yang memunculkan modal atau menu,
• validasi form sebelum data dikirim,
• menghitung harga otomatis di keranjang belanja,
• menampilkan data dari API,
• membuat fitur pencarian dan filter,
• mengubah isi halaman tanpa refresh.

Hal yang menarik, JavaScript tidak hanya dipakai di browser. Dengan Node.js, JavaScript juga dipakai untuk membuat aplikasi sisi server, otomatisasi, sampai alat pengembangan.

Selengkapnya tentang apa itu JavaScript bisa kamu pelajari di artikel berikut: Apa Itu JavaScript?

Mengapa Belajar JavaScript Penting untuk Pemula?

Ada beberapa alasan kenapa JavaScript cocok sebagai pintu masuk.

Pertama, hasilnya cepat terlihat. Kamu bisa menulis kode, buka browser, lalu langsung melihat perubahan. Untuk pemula, feedback cepat ini membuat belajar lebih “nyantol”.

Kedua, JavaScript adalah standar industri untuk web. Hampir semua website modern menggunakannya dalam bentuk apa pun, dari sedikit interaksi sampai aplikasi yang berat.

Ketiga, JavaScript membuka banyak jalur karier. Setelah paham dasar, kamu bisa memilih fokus:

• front end (membuat UI dan interaksi),
• back end (Node.js),
• full stack,
• otomasi dan integrasi,
• bahkan pengembangan aplikasi lintas platform.

Keempat, JavaScript punya ekosistem yang sangat besar. Kamu akan menemukan banyak tutorial, komunitas, dan contoh proyek sehingga belajar tidak terasa sendirian.

Cara Kerja JavaScript di Browser

Browser seperti Chrome, Firefox, atau Edge memiliki JavaScript engine yang menjalankan kode JavaScript.

Secara sederhana, saat kamu membuka halaman web:

1. Browser memuat HTML dan membentuk struktur halaman.
2. Browser memuat CSS untuk tampilan.
3. Lalu, browser menjalankan JavaScript untuk mengatur perilaku dan interaksi.

JavaScript bisa membaca dan mengubah elemen halaman lewat DOM (Document Object Model). DOM itu representasi halaman sebagai objek yang bisa diakses lewat kode.

Contohnya, kalau ada tombol di HTML, JavaScript bisa:

• mengambil tombol itu,
• mendengarkan event klik,
• menjalankan aksi tertentu.

Catatan penting untuk pemula: JavaScript di browser berjalan dalam model event. Artinya, banyak kode dieksekusi sebagai respons terhadap kejadian, misalnya klik, scroll, input keyboard, atau halaman selesai dimuat.

Dasar Sintaks dalam Belajar JavaScript Dasar

Sintaks adalah aturan penulisan kode. Di JavaScript, hal yang paling sering kamu temui:

• Pernyataan (statement).
• Blok kode menggunakan { }.
• Komentar // atau /* ... */.
• Pemanggilan fungsi namaFungsi().
• Penulisan string, angka, dan ekspresi.

Contoh sederhana:

console.log("Halo, JavaScript!");

Kode di atas menampilkan teks ke Console di browser.

Tips penting: kebiasaan menggunakan Console untuk mengecek nilai variabel akan sangat membantu saat debugging.

Komentar juga penting, terutama saat belajar.

// Ini komentar satu baris

/*
  Ini komentar
  lebih dari satu baris
*/

Variabel, Tipe Data, dan Operator dalam JavaScript

Variabel

Yang perlu kamu tahu pertama kali adalah tentang variabel. Sederhananya, variabel adalah “wadah” untuk menyimpan nilai. Di JavaScript modern, kamu biasanya menggunakan:

• let untuk nilai yang bisa berubah.
• const untuk nilai yang tidak akan kamu ganti.

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

Biasakan pakai const dulu, lalu gunakan let hanya jika memang nilai perlu berubah. Ini membuat kode lebih aman dan minim bug.

Tipe data dasar

Tipe data yang paling sering ditemui pemula:

• string untuk teks.
• number untuk angka.
• boolean untuk benar atau salah.
• null untuk nilai kosong yang disengaja.
• undefined untuk variabel yang belum punya nilai.

const judul = "Belajar JavaScript";
const total = 12000;
const aktif = true;
const kosong = null;
let belumDiisi;

Operator

Operator dipakai untuk memproses nilai.

• Aritmatika: + - * /.
• Perbandingan: === !== > < >= <=.
• Logika: && || !.

Contoh:

const a = 10;
const b = 3;

console.log(a + b);      // 13
console.log(a > b);      // true
console.log(a === 10);   // true

Catatan penting: biasakan pakai === dan !== agar perbandingan lebih ketat dan konsisten.

BACA JUGA: Vibe Coding: Solusi Cepat Buat Aplikasi dan Website dengan AI

Cara Menjalankan dan Menulis Kode Saat Belajar JavaScript Dasar

Ada beberapa cara yang paling praktis untuk pemula.

1) Pakai Console di browser

• Buka Chrome.
• Klik kanan, lalu pilih Inspect.
• Pilih tab Console.
• Tulis JavaScript langsung.

Ini cara tercepat untuk latihan konsep kecil seperti variabel, operator, dan fungsi.

2) Pakai file HTML dengan script di dalamnya

Buat file index.html:

<!DOCTYPE html>
<html>
  <head>
    <title>Latihan JS</title>
  </head>
  <body>
    <h1>Belajar JavaScript</h1>

    <script>
      console.log("JS jalan!");
    </script>
  </body>
</html>

Buka file itu di browser, lalu cek Console.

3) Pakai file .js terpisah

Lebih rapi untuk latihan yang mulai panjang.

Di HTML:

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

Lalu tulis kode di script.js.

Saran belajar: mulai dari cara kedua dulu agar paham konsep, lalu pindah ke cara ketiga agar terbiasa struktur proyek.

Contoh Program Sederhana untuk Latihan Belajar JavaScript

Contoh paling klasik adalah interaksi tombol.

File index.html:

<!DOCTYPE html>
<html>
  <body>
    <button id="btn">Klik saya</button>

    <script>
      const btn = document.getElementById("btn");

      btn.addEventListener("click", function () {
        alert("Halo! Kamu baru saja klik tombol.");
      });
    </script>
  </body>
</html>

Dari contoh ini, kamu belajar:

• mengambil elemen HTML,
• memasang event klik,
• menjalankan aksi.

Kalau ingin latihan tambahan, coba modifikasi:

• ubah teks tombol setelah diklik,
• hitung jumlah klik,
• tampilkan hasil hitung di halaman, bukan lewat alert.

Contoh kecil untuk menghitung klik:

let count = 0;
btn.addEventListener("click", function () {
  count = count + 1;
  console.log("Jumlah klik:", count);
});

Tips Belajar JavaScript Dasar

Agar belajarnya efektif dan tidak cepat mentok, berikut beberapa tips praktis.

• Mulai dari konsep paling dasar: Pahami variabel, kondisi, loop, fungsi, dan DOM. Jangan buru buru pindah ke framework.
• Latihan rutin walau singkat : Dua puluh menit per hari lebih baik daripada dua jam seminggu sekali.
• Biasakan membaca pesan error : Error adalah petunjuk. Latih diri membaca dan mencari penyebabnya.
• Tulis ulang contoh dengan versimu : Jangan copy paste. Ketik ulang, ubah variabel, dan modifikasi hasilnya.
• Buat mini project : Contoh yang cocok untuk pemula:
  • kalkulator sederhana,
  • to do list mini,
  • konversi suhu,
  • validasi form.

Pahami “kenapa” bukan hanya “bagaimana”.

Saat melihat contoh, tanyakan: kenapa pakai const, kenapa event dipasang di tombol, kenapa harus ambil elemen dari DOM.

Kelas Belajar JavaScript

Kalau kamu ingin belajar lebih terstruktur, kelas belajar Javascript dari Rumahweb bisa membantu karena ada kurikulum, latihan bertahap, dan biasanya ada jalur belajar yang jelas. Lihat daftar pembelajaran berikut:

• Pengenalan Javascript – Part ini
• Expression dan Statement
• Mengenal Variabel
• Mengenal Tipe Data

Namun, kelas pun tetap butuh latihan mandiri. Kelas yang bagus memberi arah, tapi progress tetap datang dari jam latihan.

Penutup

Belajar JavaScript dasar adalah langkah awal yang penting untuk memahami bagaimana sebuah website bisa menjadi interaktif dan dinamis. Dengan memahami pengertian, cara kerja, serta dasar sintaks JavaScript, kamu sudah memiliki fondasi yang kuat untuk melanjutkan ke materi yang lebih lanjut seperti fungsi, DOM manipulation, hingga pengembangan aplikasi web.

Kunci dari belajar JavaScript dasar adalah konsistensi dalam praktik dan mencoba langsung setiap contoh kode yang dipelajari. Semakin sering kamu bereksperimen, semakin cepat kamu memahami logika pemrograman di baliknya.

Di artikel selanjutnya, kita akan membahas materi lanjutan yang akan membantu kamu semakin mahir dalam belajar JavaScript dasar dan siap mengembangkan website yang lebih kompleks.