Tutorial Belajar JavaScript Part 8: Pengertian Core JavaScript dan DOM (Document Object Model)

Pada tutorial JavaScript part 1 – part 7, kita belum membahas cara penulisan kode program JavaScript. Di dalam tutorial-tutorial tersebut, kita mempersiapkan ‘lingkungan’ yang harus diketahui untuk dapat dengan mudah memahami dan manjalankan JavaScript.

Mempelajari JavaScript pada dasarnya terdiri dari 2 bagian besar, yakni JavaScript Inti (sering disebut dengan istilah: Core JavaScript), serta API yang disediakan oleh web browser (yang dikenal dengan istilah DOM, singkatan dari Document Object Model). Pada tutorial kali ini kita akan membahas Pengertian Core JavaScript dan DOM (Document Object Model) dalam JavaScript.

Pengertian Core JavaScript

Core JavaScript atau JavaScript inti adalah istilah yang merujuk kepada ‘Bahasa Pemograman JavaScript‘. Pada bagian Core JavaScript inilah kita akan belajar tentang aturan pemograman yang umumnya dipelajari, seperti cara pendefenisian variabel, perbedaan tipe-tipe data, cara pembuatan array, cara penulisan struktur IF, serta cara pembuatan Objek.

Bagian Core JavaScript membahas tentang “bahasa” (atau syntax) dari JavaScript. Jika anda pernah menggunakan bahasa pemograman seperti C++ atau PHP, tidak akan terlalu sulit untuk mempelajari aturan penulisan dalam JavaScript.

Perbedaan mendasar antara JavaScript dengan dengan bahasa pemograman lain, adalah sifat JavaScript yang lebih berorientasi ke Objek. Namun JavaScript ‘tidak mengharuskan’ menggunakan objek. Saya menyebutnya ‘tidak harus’ karena kita bisa membuat beberapa kode program yang seolah-olah tanpa menggunakan objek. Contohnya adalah fungsi alert.

<script>
alert(‘Hello World’);
</script>

<script>
window.alert(‘Hello World’);
</script>

Core JavaScript juga merupakan istilah untuk JavaScript yang tidak terikat dengan ‘lingkungannya’ yaitu web browser. Selama ini JavaScript hanya dikenal sebagai bahasa tipe client-side JavaScript yang dijalankan di dalam web browser.

Akan tetapi, perkembangan JavaScript saat ini juga mendukung penggunaanya di sisi server (salah satunya dengan menggunakan node.js).

Pengertian DOM (Document Object Model)

Bagian kedua yang akan kita pelajari dalam menguasai Client-Side JavaScript adalah DOM (singkatan dari Document Object Model). DOM adalah API (Application Programming Interface) yang disediakan web browser kepada programmer.

Secara sederhananya, DOM adalah kumpulan aturan atau cara bagi programmer untuk ‘memanipulasi’ apapun yang tampil dalam halaman web. DOM tidak terikat dengan JavaScript, dan sepenuhnya bukan bagian dari JavaScript. DOM yang sama bisa juga diakses dengan bahasa client-side lain seperti JScript.

Tag atau element yang ada di dalam HTML diatur di dalam DOM. Dengan menggunakan JavaScript, kita bisa memanipulasi seluruh tag HTML ini. Salah satu contoh DOM yang telah kita gunakan adalah fungsi document.getElementById.

Fungsi document.get ElementById berfungsi untuk mencari sebuah tag HTML berdasarkan id. Selain document.getElementById, dalam DOM juga disediakan fungsi lain seperti document.getElementByName, document.getElementByClass, dan lain-lain. Fitur-fitur seperti inilah yang akan kita pelajari pada bagian DOM.

Karena sifatnya yang berbeda, tutorial JavaScript di duniailkom akan memisahkan Core JavaScript dengan DOM.

Untuk tahap awal saya akan membahas tentang Core JavaScript, dan setelah itu baru mempelajari struktur dan aturan DOM dari web browser. Dalam tutorial berikutnya, kita akan mempelajari aturan dasar penulisan kode program JavaScript.

eBook JavaScript Uncover Duniailkom

JavaScript sudah menjadi fitur wajib di setiap website modern. Duniailkom telah menyusun eBook JavaScript Uncover yang membahas JavaScript dengan lebih detail dan lebih lengkap, mulai dari dasar hingga konsep DOM, Event dan AJAX. Penjelasan lebih lanjut bisa ke eBook JavaScript Uncover Duniailkom.