Debug JavaScript
Kesalahan dapat (akan) terjadi, setiap kali Anda menulis beberapa kode komputer baru.
Debug Kode
Kode pemrograman mungkin berisi kesalahan sintaks, atau kesalahan logis.
Banyak dari kesalahan ini sulit untuk didiagnosis.
Seringkali, ketika kode pemrograman mengandung kesalahan, tidak akan terjadi apa-apa. Tidak ada pesan kesalahan, dan Anda tidak akan mendapatkan indikasi di mana harus mencari kesalahan.
Mencari (dan memperbaiki) kesalahan dalam kode pemrograman disebut debugging kode.
Debugger JavaScript
Debugging tidak mudah. Tapi untungnya, semua browser modern memiliki debugger JavaScript bawaan.
Debugger bawaan dapat dihidupkan dan dimatikan, memaksa kesalahan dilaporkan kepada pengguna.
Dengan debugger, Anda juga dapat menyetel breakpoint (tempat eksekusi kode dapat dihentikan), dan memeriksa variabel saat kode dieksekusi.
Biasanya, jika tidak, ikuti langkah-langkah di bagian bawah halaman ini, Anda mengaktifkan debugging di browser Anda dengan tombol F12, dan pilih "Konsol" di menu debugger.
Metode console.log()
Jika browser Anda mendukung debugging, Anda dapat menggunakan console.log()untuk menampilkan nilai JavaScript di jendela debugger:
Contoh
<!DOCTYPE html>
<html>
<body>
<h1>My First Web Page</h1>
<script>
a = 5;
b = 6;
c = a + b;
console.log(c);
</script>
</body>
</html>
Tip: Baca lebih lanjut tentang console.log()metode ini di Referensi Konsol JavaScript kami .
Mengatur Breakpoint
Di jendela debugger, Anda dapat mengatur breakpoint dalam kode JavaScript.
Di setiap breakpoint, JavaScript akan berhenti dijalankan, dan membiarkan Anda memeriksa nilai JavaScript.
Setelah memeriksa nilai, Anda dapat melanjutkan eksekusi kode (biasanya dengan tombol putar).
Kata Kunci debugger
Kata debuggerkunci menghentikan eksekusi JavaScript, dan memanggil (jika tersedia) fungsi debugging.
Ini memiliki fungsi yang sama dengan menyetel breakpoint di debugger.
Jika tidak ada debugging yang tersedia, pernyataan debugger tidak berpengaruh.
Dengan debugger dihidupkan, kode ini akan berhenti mengeksekusi sebelum mengeksekusi baris ketiga.
Contoh
let x = 15 * 5;
debugger;
document.getElementById("demo").innerHTML = x;
Alat Debugging Peramban Utama
Biasanya, Anda mengaktifkan debugging di browser Anda dengan F12, dan pilih "Konsol" di menu debugger.
Jika tidak, ikuti langkah-langkah ini:
Chrome
- Buka peramban.
- Dari menu, pilih "Alat lainnya".
- Dari alat, pilih "Alat pengembang".
- Terakhir, pilih Konsol.
Firefox
- Buka peramban.
- Dari menu, pilih "Pengembang Web".
- Terakhir, pilih "Konsol Web".
Tepian
- Buka peramban.
- Dari menu, pilih "Alat Pengembang".
- Terakhir, pilih "Konsol".
Opera
- Buka peramban.
- Dari menu, pilih "Pengembang".
- Dari "Pengembang", pilih "Alat pengembang".
- Terakhir, pilih "Konsol".
Safari
- Pergi ke Safari, Preferences, Advanced di menu utama.
- Centang "Aktifkan Tampilkan menu Kembangkan di bilah menu".
- Ketika opsi baru "Kembangkan" muncul di menu:
Pilih "Tampilkan Konsol Kesalahan".
Tahukah kamu?
Debugging adalah proses pengujian, pencarian, dan pengurangan bug (kesalahan) pada program komputer.
Bug komputer pertama yang diketahui adalah bug nyata (serangga) yang terjebak di elektronik.