Belajar Dasar Pemrograman JavaScript
Belajar Dasar Pemrograman JavaScript
Hai para pembaca!!!
Pada artikel kali ini kita akan sedikit membahas tentang Dasar Pemrograman JavaScript. Sebenarnya apa sih JavaScript itu?
JavaScript adalah bahasa pemrograman tingkat tinggi dan dinamis. JavaScript populer di internet dan dapat bekerja di sebagian besar penjelajah web populer seperti Google Chrome, Internet Explorer, Mozilla Firefox, Netscape dan Opera. Kode JavaScript dapat disisipkan dalam halaman web menggunakan tag SCRIPT. Nah sekarang kita akan belajar beberapa contoh script dasar JavaScript.
Window Alert
Metode alert () digunakan untuk menampilkan dengan pesan khusus dan peringatan tombol kotak konfirmasi. Contohnya sperti script di bawah ini:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Window Alert</title>
</head>
<body>
<script>
window.alert('Halo My Name is Fiki Andriyan');
</script>
</body>
</html>
Dan berikut merupakan hasil dari script di atas:
Document.write
Menggunakan Fungsi document.write(). Objek document adalah objek yang mewakili dokumen HTML di dalam Javascript. Dalam objek document , terdapat fungsi write() untuk menulis sesuatu ke dokumen HTML. Contoh:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document Write</title>
</head>
<body>
<script>
document.write('Halo My Name is Fiki Andriyan');
</script>
</body>
</html>
Dan berikut merupakan hasil dari script di atas:
Document.getElementById
getElementById digunakan untuk mengambil suatu value dari form input yang pastinya dari element HTML dimana element tersebut sudah kita buatkan id. Maka kita dapat menggunakan getElementById. Mari kita coba praktekan perintah Document.getElementById perhatikan script dibawah ini:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document getElementById</title>
</head>
<body>
<h1 id="halo"></h1>
<script>
document.getElementById('halo').innerHTML = 'Halo My Name is Fiki Andriyan';
</script>
</body>
</html>
Maka hasilnya adalah
Console.log
Fungsi console.log() adalah fungsi untuk menampilkan teks ke console Javascript. Fungsi console.log() biasanya digunakan untuk debugging. Karena setiap pesaan error di Javascript selalu ditampilkan di dalam Console. Contohnya seperti script dibawah ini:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Console log</title>
</head>
<body>
<script>
console.log('Halo My Name is Fiki Andriyan');
</script>
</body>
</html>
Nah untuk memunculkan script di atas berbeda dari script sebelum sebelumnya, yaitu kita harus klik kanan pada browser kita lalu pilih inspect dan pilih console. Perhatikan gambar dibawah ini:
Variable
Variabel adalah sebuah nama yang mewakili sebuah nilai. Variabel bisa diisi dengan berbagai macam nilai seperti string (teks), number (angka), objek, array, dan sebagainya. Kita bisa ibaratkan, variabel itu seperti wadah untuk menyimpan sesuatu. Contoh dari Variable adalah sebagai berikut
Untuk variable kita coba dengan kasus sederhana misalnya kita mempunyai 2 variable. Variable yang pertama kita beri nama angka1 dan variable yang kedua kita beri nama angka2, Lalu kita akan mengalikan variable pertama dan kedua dan kita akan menampilkan hasilnya dengan perintah document.write(). Perhatikan script dibawah ini:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Variable</title>
</head>
<body>
<script>
var angka1 = 5;
var angka2 = 10;
document.write(angka1 * angka2);
</script>
</body>
</html>
Maka hasil yang didapat yaitu:
Terimakasih telah meluangkan waktu untuk membaca sampai akhir semoga bermanfaat bagi kalian para pembaca. Mohon maaf apabila ada kata yang tidak dimengerti atau penjelasan yang kurang jelas atau berbelit belit.
nice
BalasHapusbagus banget
BalasHapus