DISKON TERBATAS! Masukkan kupon "skillbaru" saat checkout di kelas apa saja

Logo Koala Skodev mengetik

Skodev

Belajar coding dalam bahasa Indonesia

LOGGING AND BREAKPOINTS

Pelajari cara menggunakan log dan breakpoint dalam JavaScript untuk mencari dan memperbaiki bug dalam kode kamu.

Memahami bagaimana cara mencari dan memperbaiki bug atau kesalahan dalam kode adalah keterampilan penting yang perlu dimiliki oleh setiap pengembang. Dalam JavaScript, ada dua fitur yang sangat membantu dalam hal ini: logging dan breakpoints.

Logging dalam JavaScript

Logging adalah cara untuk melacak apa yang sedang terjadi dalam kode kamu. Dengan menambahkan pernyataan log ke kode, kamu dapat mencetak pesan ke konsol yang mencakup informasi tentang variabel, fungsi, atau blok kode tertentu.

JavaScript menyediakan objek console untuk keperluan logging, yang memiliki beberapa metode yang dapat kamu gunakan.

console.log()

Metode console.log() adalah alat logging paling dasar dalam JavaScript. Ia mencetak pesan ke konsol web.

Contoh penggunaannya adalah:

console.log('Halo, Dunia!');

console.error() dan console.warn()

Metode console.error() dan console.warn() dapat digunakan untuk mencetak pesan error dan peringatan. Ini berguna ketika kamu ingin membedakan antara output log biasa dan pesan yang menunjukkan masalah dalam kode.

Contoh penggunaannya adalah:

console.error('Ini adalah pesan error');
console.warn('Ini adalah peringatan');

Breakpoints dalam JavaScript

Breakpoint adalah titik dalam kode di mana eksekusi berhenti, sehingga kamu dapat memeriksa nilai variabel dan alur eksekusi kode. Ini sangat berguna untuk men-debug kode yang kompleks dan memahami bagaimana dan kapan fungsi atau blok kode tertentu dieksekusi.

Mengatur Breakpoints

Untuk mengatur breakpoint dalam JavaScript, kamu dapat menggunakan alat developer yang ada di browser. Alat ini bervariasi antar browser, tetapi kamus ejaan setiap yang baik seperti Chrome, Firefox, dan Edge semuanya memiliki fitur ini.

Berikut adalah cara mengatur breakpoint di Chrome:

  1. Buka Tools Developer (F12 atau klik kanan pada halaman dan pilih Inspect).
  2. Navigasi ke tab Sources.
  3. Temukan file JavaScript kamu dan klik pada nomor baris di mana kamu ingin mengatur breakpoint.

Sekarang, ketika kamu menjalankan kode, eksekusi akan berhenti di titik tersebut, memungkinkan kamu untuk memeriksa variabel dan eksekusi langkah-demi-langkah.

Menggunakan Statement debugger

JavaScript juga memiliki statement debugger yang dapat kamu masukkan ke kode kamu. Ketika browser memenuhi statement ini, ia akan berhenti seperti saat breakpoint diatur, selama alat developer browser terbuka.

Contoh penggunaannya adalah:

for (let i = 0; i < 10; i++) {
    debugger;
    console.log(i);
}

Dengan menambahkan debugger; dalam loop, browser akan berhenti setiap kali loop dieksekusi, memungkinkan kamu untuk melihat bagaimana nilai i berubah setiap putaran.

Dengan memahami dan memanfaatkan logging dan breakpoints dalam JavaScript, kamu akan lebih mahir dalam mencari dan memperbaiki bug dalam kode kamu. Selamat mencoba!

👈🏼 Browser dev tools
Performance profiling JS 👉🏼