JavaScript adalah bahasa pemrograman yang digunakan untuk membuat interaksi pada halaman web. Dalam tutorial ini, saya akan memberikan pengantar dasar tentang JavaScript dan cara menggunakannya pada halaman web.
1. Persiapan
Sebelum memulai menulis kode JavaScript, pastikan bahwa Anda sudah memiliki dokumen HTML. Anda dapat menambahkan kode JavaScript di dalam tag <script>
di dalam tag <head>
atau <body>
dokumen HTML.
2. Variabel dan Tipe Data
Seperti bahasa pemrograman lainnya, JavaScript menggunakan variabel dan tipe data. Anda dapat membuat variabel dengan menggunakan kata kunci var
, let
, atau const
. Berikut adalah contoh pembuatan variabel:
var nama = "John"; let umur = 30; const PI = 3.14;
Tipe data yang dapat digunakan di JavaScript adalah string
, number
, boolean
, null
, undefined
, dan object
.
3. Kondisi dan Perulangan
Untuk mengatur alur program pada JavaScript, Anda dapat menggunakan kondisi dan perulangan. Berikut adalah contoh penggunaan kondisi dan perulangan:
// Kondisi if (umur > 18) { console.log("Anda sudah dewasa"); } else { console.log("Anda masih di bawah umur"); } // Perulangan for (let i = 0; i < 10; i++) { console.log(i); }
4. Fungsi
Fungsi adalah blok kode yang dapat digunakan kembali di berbagai bagian program. Anda dapat membuat fungsi dengan menggunakan kata kunci function
. Berikut adalah contoh pembuatan fungsi:
function tambah(a, b) { return a + b; } let hasil = tambah(2, 3); console.log(hasil);
5. Event dan Manipulasi DOM
JavaScript juga dapat digunakan untuk menangani event dan memanipulasi elemen HTML di dalam halaman web. Berikut adalah contoh penggunaan event dan manipulasi DOM:
// Menambahkan event click pada tombol let tombol = document.querySelector("button"); tombol.addEventListener("click", function() { alert("Tombol ditekan!"); }); // Mengubah teks pada elemen HTML let judul = document.querySelector("h1"); judul.innerHTML = "Selamat datang di halaman web!";
6. Menyimpan dan Menerapkan Kode JavaScript
Setelah selesai menulis kode JavaScript, simpan file dengan ekstensi .js
. Kemudian, hubungkan kode JavaScript dengan dokumen HTML dengan menambahkan tag <script>
di dalam tag <head>
atau <body>
. Berikut adalah contoh kode untuk menghubungkan kode JavaScript dengan dokumen HTML:
<head> <script src="script.js"></script> </head>
Itulah tutorial dasar tentang JavaScript. Sekarang Anda dapat mencoba menambahkan interaksi pada halaman web dengan menggunakan JavaScript. Anda juga dapat mengembangkan pengetahuan JavaScript Anda dengan mencari lebih banyak materi dan contoh.