Menyahpepijat JavaScript dalam Penyemak Imbas (dengan Contoh)

Dalam tutorial ini, anda akan belajar mengenai penyahpepijatan dalam JavaScript dengan bantuan contoh.

Anda boleh dan akan menghadapi kesilapan semasa menulis program. Kesalahan tidak semestinya buruk. Sebenarnya, selalunya, mereka membantu kita mengenal pasti masalah dengan kod kita. Anda mesti mengetahui cara menyahpepijat kod anda dan memperbaiki kesilapan.

Debugging adalah proses memeriksa program, mencari kesalahan dan memperbaikinya.

Terdapat pelbagai cara untuk men-debug program JavaScript anda.

1. Menggunakan console.log ()

Anda boleh menggunakan console.log()kaedah untuk menyahpepijat kod. Anda boleh memasukkan nilai yang ingin anda periksa ke dalam console.log()kaedah dan mengesahkan apakah data tersebut betul.

Sintaksnya adalah:

 console.log(object/message);

Anda boleh memasukkan objek console.log()atau hanya rentetan mesej.

Dalam tutorial sebelumnya, kami menggunakan console.log()kaedah untuk mencetak output. Walau bagaimanapun, anda juga boleh menggunakan kaedah ini untuk melakukan debug. 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()kaedah dalam penyemak imbas akan membuka nilai di tetingkap penyahpepijat.

Mengendalikan kaedah console.log () dalam penyemak imbas

Ini console.log()tidak khusus untuk penyemak imbas. Ia juga terdapat di enjin JavaScript lain.

2. Menggunakan penyahpepijat

Kata debuggerkunci menghentikan pelaksanaan kod dan memanggil fungsi penyahpepijatan.

Ini debuggerterdapat di hampir semua mesin JavaScript.

Mari lihat contoh,

 let a = 6; let b = 9; let c = a * b; // stops the execution debugger; console.log(c);

Mari lihat bagaimana anda boleh menggunakan penyahpepijat dalam penyemak imbas Chrome.

Mengendalikan penyahpepijat dalam penyemak imbas

Program di atas menghentikan pelaksanaan program dalam baris yang mengandungi debugger.

Anda kemudian boleh menyambung semula kawalan aliran setelah memeriksa program.

Selebihnya kod akan dilaksanakan apabila anda menyambung semula skrip dengan menekan play di konsol.

Mengendalikan penyahpepijat dalam penyemak imbas

3. Menetapkan Titik Putus

Anda boleh menetapkan titik putus untuk kod JavaScript di tetingkap penyahpepijat.

JavaScript akan berhenti dijalankan pada setiap titik putus dan membolehkan anda memeriksa nilainya. Kemudian, anda boleh meneruskan pelaksanaan kod.

Mari kita lihat contohnya dengan menetapkan titik putus dalam penyemak imbas Chrome.

Mengendalikan titik putus dalam penyemak imbas

Anda boleh menetapkan titik putus melalui alat Pembangun di mana sahaja dalam kod.

Menetapkan titik putus sama dengan meletakkan debugger dalam kod. Di sini, anda hanya menetapkan titik putus dengan mengklik nombor baris kod sumber dan bukannya memanggil fungsi debugger secara manual.

Dalam kaedah di atas, kami telah menggunakan penyemak imbas Chrome untuk menunjukkan proses penyahpepijatan untuk kesederhanaan. Namun, itu bukan satu-satunya pilihan anda.

Semua IDE yang baik menyediakan kaedah untuk anda menyahpepijat kod tersebut. Proses debugging mungkin sedikit berbeza tetapi konsep di sebalik debugging adalah sama.

Artikel menarik...