Dalam tutorial ini, Anda akan belajar tentang debugging di JavaScript dengan bantuan contoh.
Anda dapat dan akan mengalami kesalahan saat menulis program. Kesalahan tidak selalu buruk. Faktanya, sebagian besar waktu, mereka membantu kami mengidentifikasi masalah dengan kode kami. Penting bagi Anda untuk mengetahui cara men-debug kode Anda dan memperbaiki kesalahan.
Debugging adalah proses memeriksa program, menemukan kesalahan dan memperbaikinya.
Ada berbagai cara untuk men-debug program JavaScript Anda.
1. Menggunakan console.log ()
Anda dapat menggunakan console.log()metode ini untuk men-debug kode. Anda dapat mengirimkan nilai yang ingin Anda periksa ke dalam console.log()metode dan memverifikasi apakah datanya benar.
Sintaksnya adalah:
console.log(object/message);
Anda bisa memasukkan objek ke dalam console.log()atau hanya string pesan.
Dalam tutorial sebelumnya, kami menggunakan console.log()metode untuk mencetak output. Namun, Anda juga dapat menggunakan metode ini untuk debugging. Sebagai contoh,
let a = 5; let b = 'asdf'; let c = a + b; // if you want to see the value of c console.log(c); // then do other operations if(c) ( // do something )
Menggunakan console.log()metode di browser membuka nilai di jendela debugger.
Cara kerja metode console.log () di browser
Ini console.log()tidak spesifik untuk browser. Ini juga tersedia di mesin JavaScript lainnya.
2. Menggunakan debugger
Kata debuggerkunci menghentikan eksekusi kode dan memanggil fungsi debugging.
The debuggertersedia di hampir semua mesin JavaScript.
Mari kita lihat contohnya,
let a = 6; let b = 9; let c = a * b; // stops the execution debugger; console.log(c);
Mari kita lihat bagaimana Anda dapat menggunakan debugger di browser Chrome.
Bekerja dari debugger di browser
Program di atas menjeda eksekusi program di baris yang berisi debugger.
Anda kemudian dapat melanjutkan kontrol aliran setelah memeriksa program.
Kode lainnya akan dieksekusi saat Anda melanjutkan skrip dengan menekan putar di konsol.
Bekerja dari debugger di browser
3. Mengatur Breakpoints
Anda dapat menyetel breakpoint untuk kode JavaScript di jendela debugger.
JavaScript akan berhenti dijalankan di setiap breakpoint dan memungkinkan Anda memeriksa nilainya. Kemudian, Anda dapat melanjutkan eksekusi kode.
Mari kita lihat contoh dengan mengatur breakpoint di browser Chrome.
Bekerja dari breakpoint di browser
Anda dapat menyetel breakpoint melalui alat Pengembang di mana pun dalam kode.
Menyetel breakpoint mirip dengan menempatkan debugger dalam kode. Di sini, Anda cukup menyetel breakpoint dengan mengklik nomor baris kode sumber alih-alih memanggil fungsi debugger secara manual.
Dalam metode di atas, kami telah menggunakan browser Chrome untuk menunjukkan proses debugging agar lebih sederhana. Namun, itu bukan satu-satunya pilihan Anda.
Semua IDE yang bagus menyediakan cara bagi Anda untuk men-debug kode. Proses debugging mungkin sedikit berbeda tetapi konsep di balik debugging sama.
