JavaScript (JS) adalah salah satu teknologi inti dari World Wide Web, bersama dengan HTML dan CSS. Jika HTML adalah struktur kerangka dan CSS adalah gaya visualnya, maka JavaScript adalah otaknya—ia memungkinkan interaksi dinamis di halaman web.
Apa Itu JavaScript?
JavaScript adalah bahasa pemrograman tingkat tinggi, dinamis, dan seringkali digunakan sebagai bahasa skrip. Awalnya, ia hanya berjalan di sisi klien (browser), tetapi kini dengan adanya Node.js, JavaScript juga dapat digunakan di sisi server. Mempelajari dasar pemrograman JavaScript adalah langkah krusial bagi siapa pun yang ingin membangun pengalaman web modern yang kaya.
Variabel dan Tipe Data
Sama seperti bahasa pemrograman lainnya, JavaScript menggunakan variabel untuk menyimpan nilai. Deklarasi variabel saat ini paling umum menggunakan kata kunci let atau const (daripada var yang lebih lama).
Deklarasi Variabel
// Variabel yang nilainya bisa diubah
let namaPengguna = "Budi";
// Variabel yang nilainya tetap (konstanta)
const TAHUN_LAHIR = 1995;
// Contoh penggunaan
console.log(namaPengguna);
Tipe Data Dasar
JavaScript memiliki beberapa tipe data primitif:
- String: Teks (misalnya, "Halo Dunia").
- Number: Angka, baik integer maupun float (misalnya, 42 atau 3.14).
- Boolean: Nilai logis (
trueataufalse). - Undefined: Variabel yang dideklarasikan tetapi belum diberi nilai.
- Null: Mewakili nilai 'tidak ada nilai' yang disengaja.
Struktur Kontrol: Pengambilan Keputusan
Kode perlu membuat keputusan berdasarkan kondisi tertentu. Ini dilakukan menggunakan pernyataan kondisional seperti if, else if, dan else.
Pernyataan If...Else
let usia = 18;
if (usia >= 17) {
console.log("Anda memenuhi syarat untuk memilih.");
} else {
console.log("Anda masih terlalu muda.");
}
Selain itu, ada juga struktur perulangan (Loops) seperti for dan while yang memungkinkan kita mengulang blok kode berkali-kali.
Fungsi: Blok Kode yang Dapat Digunakan Kembali
Fungsi adalah fondasi dari pemrograman terstruktur. Mereka memungkinkan Anda mengelompokkan kode yang melakukan tugas tertentu, yang kemudian dapat Anda panggil kapan pun dibutuhkan, tanpa harus menulis ulang kode tersebut.
Mendefinisikan Fungsi
// Fungsi tradisional
function sapa(nama) {
return "Selamat datang, " + nama + "!";
}
// Arrow Function (lebih modern)
const hitungPerkalian = (a, b) => {
return a * b;
};
// Memanggil fungsi
let pesan = sapa("Andi"); // pesan bernilai "Selamat datang, Andi!"
console.log(pesan);
console.log(hitungPerkalian(5, 4)); // Output: 20
Bekerja dengan DOM (Document Object Model)
Kekuatan utama JavaScript di web adalah kemampuannya memanipulasi DOM. DOM adalah representasi terstruktur dari halaman HTML. Dengan JS, kita bisa mengubah teks, mengganti gambar, merespons klik tombol, dan bahkan menambahkan elemen baru ke halaman secara dinamis.
Contoh Sederhana Manipulasi DOM
Misalnya, untuk mengubah teks pada elemen dengan ID "judul":
// 1. Temukan elemen berdasarkan ID
const elemenJudul = document.getElementById("judul");
// 2. Ubah isinya
if (elemenJudul) {
elemenJudul.textContent = "Judul Telah Berubah Oleh JavaScript!";
}
Pemahaman terhadap variabel, struktur kontrol, fungsi, dan DOM adalah dasar kokoh untuk melangkah lebih jauh dalam dunia pengembangan web interaktif menggunakan JavaScript.
Dengan menguasai dasar-dasar ini, Anda siap menjelajahi topik yang lebih kompleks seperti Asynchronous JS, Class, dan penggunaan Framework modern.