Chrome DevTools memungkinkan Anda melihat beberapa variabel dengan mudah di seluruh aplikasi. Mengamati variabel dalam Sumber akan membuat Anda tidak perlu membuka konsol dan berfokus untuk meningkatkan kualitas kode.
Panel Sumber menyediakan kemampuan untuk memantau variabel dalam aplikasi Anda. Bagian ini terletak di bagian watch pada sidebar debugger. Dengan memanfaatkan fungsi ini, Anda tidak perlu berulang kali mencatat objek ke konsol.
Menambahkan variabel
Untuk menambahkan variabel ke daftar tonton, gunakan ikon tambahkan di sebelah kanan judul bagian. Tindakan ini akan membuka input inline tempat Anda memberikan nama variabel yang akan diamati. Setelah diisi, tekan tombol Enter untuk menambahkannya ke daftar.
Pengamat akan menampilkan nilai variabel saat ini saat ditambahkan. Jika variabel tidak
ditetapkan atau tidak dapat ditemukan, variabel tersebut akan menampilkan
Memperbarui variabel
Nilai variabel dapat berubah saat aplikasi terus beroperasi. Daftar pantau bukan tampilan langsung variabel kecuali jika Anda melangkah melalui eksekusi. Saat Anda menelusuri eksekusi menggunakan breakpoints, nilai yang dipantau akan diperbarui secara otomatis. Untuk memeriksa ulang variabel dalam daftar secara manual, tekan tombol muat ulang di sebelah kanan judul bagian.
Saat refresh diminta, status aplikasi saat ini akan diperiksa ulang. Setiap item yang ditonton akan diperbarui dengan nilai saat ini.
Menghapus variabel
Agar hal yang Anda lihat tetap minimal untuk pekerjaan yang lebih cepat, Anda mungkin perlu menghapus variabel dari daftar pantau. Hal ini dapat dilakukan dengan mengarahkan kursor ke variabel, lalu mengklik ikon penghapusan yang muncul di sebelah kanan.