cloud-hosting-terbaik-indonesia

Tutorial Belajar JavaScript Part 4: Cara Menampilkan Pesan Kesalahan (Error) JavaScript

Posted on

Sebelum mulai mengetik program JavaScript, pada panduan belajar JavaScript kali ini kita akan membahas mengenai Cara Menampilkan Pesan Kesalahan (Error) dalam JavaScript.


Cara Menampilkan Error JavaScript

Kemudahan bagi menjalankan JavaScript hanya dengan web browser, memberikan permasalah tersendiri bagi programmer. Biasanya pada merancang program adakalanya kita menjalankan kesalahan penulisan program, seperti salah penulisan kegunaan, atau lupa menambahkan tanda “;” selaku penutup baris. Biasanya pesan kesalahan akan seketika ditampilkan, dan kita tinggal menjalankan koreksi.

Akan tetapi, pesan kesalahan (error) bagi JavaScript tak seketika ditampilkan web browser. Web browser di dasarnya ialah program bagi menampilkan halaman web, dan secara default web browser “menyembunyikan” permasalahan coding halaman web yang ditampilkan. Hal ini bermanfaat bagi pengguna awam yang pasti akan bingung melihat pesan-pesan error dari sebuah halaman web.

Khusus bagi programmer, kita butuh hal sebaliknya, yaitu agar web browser dapat menampilkan pesan kesalahan dari program yang kita bikin.

Beberapa tahun yang lalu, bagi kebutuhan debugging ini kita mesti menggunakan plugin tambahan yang diinstall ke pada web browser. Namun dikala ini, web browser telah menyediakan fitur bawaan bagi menampilkan kesalahan dan proses debugging bagi programmer web, terutama JavaScript.


Fitur Developer Tools pada Google Chrome

Jikalau kamu menggunakan Google Chrome, di web browser ini terdapat fitur yang dinamakan Developer Tools dan JavaScript Console. Sesuai dengan namanya, Developer Tools ialah fasilitas yang dirancang bagi pengembangan web. Dengan fitur ini, kita dapat menampilkan pesan kesalahan JavaScript, HTML, CSS dan melihat efeknya secara real time.

Bagi mengakses fitur ini, silahkan klik tombol pengaturan Google Chrome yang terletak di kanan atas, cari fitur Tools, lalu pilih diantara Developer Tools atau JavaScript Console. Developer Tools dapat pun dibuka dengan shortcut tombol keyboard: ctrl+shift+i. Bagi kenyamanan, kamu dapat menghapalkan tombol shortcut tersebut karena kita akan sering menggunakan fitur Developer Tools ini.

Berikut ialah tampilan fitur di Google Chrome:

Ketika fitur Developer Tools ditampilkan, kamu akan melihat banyak tab-tab yang disediakan bagi kebutuhan debugging, namun bagi dikala ini kita hanya fokus di tab console. Di tab console inilah pesan error JavaScript akan ditampilkan.

Bagi mengujinya, silahkan modifikasi contoh halaman belajar_js.html kita sebelumnya. Hapus beberapa huruf dari kode JavaScript yang terdapat, lalu jalankan dengan jendela Developer Tools pada keadaan terbuka, karenanya kamu dapat melihat error program ditampilkan di tab console, dan juga baris dimana kode tersebut error.


Fitur Web Developer pada Mozilla Firefox

Selain Google Chrome, Mozilla Firefox adalah diantara web browser populer lainnya. Sama seperti Google Chrome, secara default bawaan Firefox pun tak menampilkan pesan error JavaScript. Bagi menampilkannya, kita mesti mengakses jend
ela Web Developer.

Bagi memunculkan jendela Web Developer, klik fitur Firefox di kiri atas web browser, lalu pilih fitur Web Developer.

Sahabat pun dapat menggunakan shortcut yang sama dengan Google Chrome, yakni kombinasi tombol keyboard: ctrl+shift+i. Berikut ialah tampilan alternatif fitur pada Firefox:

Fitur di Web Developer lumayan komplit, namun kita hanya akan fokus di alternatif console, karena di fitur inilah error JavaScript akan ditampilkan.

Sama seperti di fitur Developer Tools bawaan Google Chrome, cobalah menghapus beberapa baris kode program dari contoh di panduan Cara Menjalankan Kode Program JavaScript, dan jalankan dengan Firefox bagi melihat tampilan kode error.

Setiap program web developer menyediakan fitur bagi menampilkan error JavaScript. Namun masing-masing mempunyai settingan “error” yang ditampilkan. Misalnya bagi Firefox Web Developer, akan menampilkan error seandainya character set tak didefenisikan di header HTML, namun pesan error ini tak tampil di Google Chrome.

Bagi menghilangkan pesan error character set dari Firefox Web Developer, kita tinggal menambahkan baris meta tag pada bagian header HTML seperti berikut ini:

Beberapa error pun tak berdampak “serius” pada menjalankan JavaScript. Jikalau kamu memeriksa kode error yang terdapat pada situs duniailkom, kamu akan menemukan banyak error, namun kode JavaScript yang terdapat tetap dapat berjalan.

Akan tetapi, khusus pada tahap pembelajaran, sedapat mungkin kita menghindari error kode program ini.


Web Developer “must-have” Plugin: Firebug

Sebelum web browser menyediakan fitur web developer, Plugin Firebug adalah program plugin yang mesti diinstall oleh web programmer. Plugin ini menawarkan fasilitas komplit bagi menulis program, debugging, dan mengedit JavaScript di dikala yang bersamaan.

Plugin Firebug terdapat bagi Mozilla Firefox dan Google Chrome. Sahabat boleh menginstall plugin ini bagi mengetahui fitur-fitur apa saja yang disediakan oleh firebug. Plugin Firebug adalah alternatif alternatif bagi menggantikan fitur web developer bawaan web browser.

Di pada panduan kali ini, kita telah berkenalan dengan program web developer bagi memeriksa dan menampilkan error kode JavaScript. Walaupun saya hanya membahas program web developer bagi Google Chrome dan Mozilla Firefox saja, secara umum setiap web browser modern dikala ini telah menyediakan fitur yang serupa.

Selain bagi menampilkan error, bagian console di segala fitur web developer ini pun berfungsi bagi menampilkan hasil dari kode JavaScript. Saya akan membahas caranya pada beberapa panduan javascript lainnya.

Pada panduan berikutnya, kita akan mulai mempelajari JavaScript, yaitu Cara Memasukkan kode JavaScript ke dalam HTML.


eBook JavaScript Uncover Duniailkom

JavaScript telah menjadi fitur wajib di setiap situs modern. Duniailkom telah menyusun eBook JavaScript Uncover yang membahas JavaScript dengan lebih detail dan lebih komplit, mulai dari mendasar hingga konsep DOM, Event dan AJAX. Penjelasan lebih lanjut dapat ke eBook JavaScript Uncover Duniailkom.


Sumber https://www.duniailkom.com/