Chrome DevTools memungkinkan Anda melihat beberapa variabel dengan mudah di seluruh aplikasi. Menonton variabel dalam Sources membuat Anda tidak perlu memakai konsol dan fokus untuk meningkatkan kode.
Panel Sumber menyediakan kemampuan untuk melihat variabel dalam aplikasi Anda. Tombol ini berada di bagian tonton sidebar debugger. Dengan memanfaatkan fungsi ini, Anda tidak akan memerlukan log objek ke konsol berulang kali.
Menambahkan variabel
Untuk menambahkan variabel ke daftar pantauan, gunakan ikon tambahkan di sebelah kanan judul bagian. Tindakan ini akan membuka input inline tempat Anda memberikan nama variabel untuk dipantau. Setelah terisi, tekan tombol Enter untuk menambahkannya ke dalam daftar.
Watcher akan menunjukkan nilai variabel saat ini saat ditambahkan. Jika variabel tidak ditetapkan atau tidak dapat ditemukan, variabel akan menampilkan
Memperbarui variabel
Nilai variabel dapat berubah saat aplikasi terus beroperasi. Daftar pantauan bukanlah tampilan langsung variabel, kecuali jika Anda melangkah melalui eksekusi. Saat Anda melakukan eksekusi menggunakan titik henti sementara, nilai yang diamati akan diperbarui secara otomatis. Untuk memeriksa kembali variabel dalam daftar secara manual, tekan tombol refresh di sebelah kanan judul bagian.
Saat refresh diminta, status aplikasi saat ini akan diperiksa ulang. Setiap item yang dipantau 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 pantauan. Hal ini dapat dilakukan dengan mengarahkan kursor ke variabel, lalu mengklik ikon penghapusan yang muncul di sebelah kanan.
