Pengenalan Dasar JavaScript dan Contohnya

Pengenalan Dasar JavaScript dan Contohnya - JavaScript pertama kali diciptakan oleh Brendan Elich pada tahun 1995, seorang programming dari Netscape yang memulai mengembangkan sebuah bahasa pemrograman script yang diberi nama Mocha, lalu diganti dengan nama LiveScript dan berujung menjadi JavaScript. JavaScript merupakan salah satu bahasa pemrograman yang sangat populer dan banyak digunakan oleh para developer sebagai bahasa pemrograman yang penting untuk dipelajari.

Pengertian JavaScript

JavaScript adalah bahasa pemograman yang sering digunakan untuk membuat fitur interaktif pada sebuah website, seperti ketika ingin membuat game, bisa melakukan perubahan ketika mengklik tombol button, menambahkan efek dinamik, dan animasi dengan menggunakan bahasa JavaScript.

JavaScript merupakan bahasa pemograman yang sangat profesional dan dapat dikolaborasikan dengan dokumen HTML untuk membuat website yang lebih interaktif dan dapat berfungsi lebih baik lagi.

Bahasa pemrograman JavaScript merupakan bahasa yang cukup lengkap dan sangat fleksibel, Maka banyak para developer (programmer) menyediakan tool yang berdiri di atas core JavaScript agar dapat menggunakan fungsi-fungsi ekstra.

Apa saja tool yang disediakan ?

1. Application Programming Interfaces (APIs) yang dibangun pada web browser agar memungkinkan anda untuk melakukan apapun dari dinamik dokumen HTML dan set CSS yang dibuat untuk menangkap dan memodifikasi video dari web cam, atau membuat animasi 3D dan sampel audio.

2. API pihak ketiga yang menyediakan akses untuk developer dalam menghubungkan aplikasi mereka pada website atau aplikasi lain misalnya seperti facebook dan twitter. Pernahkan anda login soundcloud dengan facebook ? itu lah API pihak ketiga.

3. Frameworks pihak ketiga dan libraries yang dapat digabungkan pada HTML sehingga memungkinkan developer membangun website atau aplikasi dengan cepat.

Pada artikel ini hanya membahas untuk pengenalan saja, kami tidak ingin membingungkan anda pada tingkat ini dengan membahas secara detail tentang perbedaan antara inti bahasa javascript dan perbedaan alat yang digunakan di atas.

Contoh Kode JavaScript

Berikut ini adalah contoh standar untuk dasar pemrograman menggunakan JavaScript dengan contoh yang terbilang cukup sederhana, agar sobat dapat mengerti standar penggunaan bahasa JavaScript dalam bahasa pemrograman yang akan kita terapkan nantinya. Oke langsung saja, yuk simak langkah-langkah di bawah ini:

1. Pertama buka kode editor anda, dan buatlah sebuah file baru dengan nama main.js dan simpan di dalam folder baru dengan nama scripts.

2. Kedua buka file index.html yang sudah anda buat sebelumnya, dan ketikkan elemen berikut pada baris sebelum tag penutup </body> seperti ini:

3. Tiga cara ini hampir sama dengan cara kerja elemen <link> untuk CSS yang menempatkan JavaScript ke halaman, sehingga dapat memberikan pengaruh pada kode HTML atau CSS, dan lainnya pada halaman.

4. Empat sekarang tambahkan script berikut pada file main.js:

var myHeading = document.querySelector('h1');
myHeading.innerHTML = 'Hello world!';

5. Lima sekarang pastikan file HTML dan JavaScript sudah disimpan, dan buka file index.html di browser yang anda gunakan.

Penjelasan text heading anda telah berhasil diubah menjadi "Hello world!" dengan mengunakan JavaScript. Disini kita melakukannya dengan menggunakan fungsi querySelector() untuk mendapatkan referensi buat heading, dan menyimpannya di variabel myHeading. Ini sama halnya seperti yang kita lakukan saat menggunakan CSS selector, saat kita menginginkan untuk melakukan sesuatu ke sebuah elemen, maka kita perlu memilihnya terlebih dahulu. Dengan menambahkan nilai dari variabel myHeading properti innerHTML atau dimana mewakili konten heading menuju ke "Hello world!".

Contoh Dasar JavaScript

Agar lebih jelas lagi pengenalan tentang bahasa pemrograman JavaScript, kita buat contoh lagi dengan cara yang sederhana dan cukup jelas untuk pemula yang baru belajar JavaScript dasar supaya dapat memahami. Sekarang buat dulu sebuah file html seperti contoh di bawah ini:

<html>
<head>
<title>Pengenalan Dasar JavaScript dan Contohnya</title>
</head>
<body>

</body>
</html

Simpan dengan index.html

Selanjutnya silahkan sobat tambahkan kode JavaScript kedalam tag <head> (di bawah tag <title>) Seperti contoh di bawah ini :

<!DOCTYPE html>
<html>
<head>
    <title>Pengenalan Dasar JavaScript dan Contohnya</title>
     <script type="text/javascript">
     alert("Belajar JavaScript Di Blog CodingLan");
     </script>
</head>
<body>

</body>
</html>

Kalau sudah ditambahkan skrip JavaScript nya, jangan lupa di save dulu file index.html nya sebelum dibuka pada browser.

Skrip yang kita tulis di atas akan menampilkan sebuah MessageBox dengan judul teks "Pengenalan Dasar JavaScript dan Contohnya" dan ketika file HTML nya kita buka di browser maka hasil yang keluar (output) adalah teks "Belajar JavaScript di Blog CodingLan" seperti yang sudah kita buat pada script di atas.

Kesimpulan

Cara ini hampir sama dengan cara kerja elemen <link> untuk CSS yang menempatkan JavaScript ke halaman, sehingga dapat memberikan pegaruh pada kode HTML atau CSS yang kita buat. Jika anda sudah mengikuti seluruh instruksi di atas sampai akhir, saya yakin anda sudah dapat mengerti sedikit dari pada sebelumnya mengenai pengenalan dasar tentang JavaScript dan Contohnya. masih banyak lagi pengenalan lainnya tentang JavaScript! Namun yang dapat saya sampaikan hanya pengenalan dasar dan contoh sederhananya saja. Demikian yang dapat kami sampaikan, semoga dapat bermanfaat. Terimakasih

Techo