Modul Pembelajaran JavaScript Dasar
1. Sintaks Dasar JavaScript
JavaScript adalah bahasa pemrograman yang digunakan untuk membuat halaman web
menjadi interaktif. Sintaks dasar mencakup penggunaan variabel, tipe data, dan operator.
Contoh:
let nama = 'Andi';
const umur = 25;
let aktif = true;
2. Struktur Kontrol
Struktur kontrol digunakan untuk mengatur alur eksekusi program berdasarkan kondisi
atau perulangan.
Contoh:
if (umur > 18) {
console.log('Dewasa');
} else {
console.log('Anak-anak');
}
3. Fungsi dan Scope
Fungsi adalah blok kode yang dapat digunakan kembali. Scope menentukan aksesibilitas
variabel dalam fungsi.
Contoh:
function sapa(nama) {
return 'Halo ' + nama;
}
4. Manipulasi DOM (Document Object Model)
DOM memungkinkan JavaScript untuk mengakses dan memanipulasi elemen HTML secara
dinamis.
Contoh:
document.getElementById('judul').innerText = 'Selamat Datang';
5. Event Handling
Event handling memungkinkan JavaScript merespons interaksi pengguna seperti klik,
hover, dan submit.
Contoh:
document.getElementById('tombol').addEventListener('click',
function() {
alert('Tombol diklik!');
});
6. Asynchronous JavaScript Dasar
JavaScript mendukung pemrograman asynchronous menggunakan callbacks, Promises, dan
async/await untuk menangani operasi yang memerlukan waktu seperti pengambilan data
dari server.
Contoh Promise:
fetch('data.json')
.then(response => response.json())
.then(data => console.log(data));
7. Proyek Kecil: Interaktivitas Halaman Web
Tambahkan interaktivitas sederhana ke halaman web Anda, seperti validasi formulir,
menampilkan/menyembunyikan elemen, atau membuat galeri gambar.
Contoh Validasi Formulir:
document.getElementById('form').addEventListener('submit',
function(e) {
let nama = document.getElementById('nama').value;
if (nama === '') {
alert('Nama harus diisi');
e.preventDefault();
}
});