Chrome DevTools به شما این امکان را می دهد که به راحتی چندین متغیر را در برنامه خود مشاهده کنید. تماشای متغیرها در Sources شما را از کنسول دور نگه می دارد و روی بهبود کد خود تمرکز می کنید.
پنل Sources امکان تماشای متغیرهای درون برنامه شما را فراهم می کند. این در بخش ساعت در نوار کناری دیباگر قرار دارد. با استفاده از این قابلیت، نیازی به ثبت مکرر اشیاء در کنسول نخواهید داشت.
اضافه کردن متغیرها
برای افزودن یک متغیر به لیست تماشا، از نماد افزودن در سمت راست عنوان بخش استفاده کنید. این یک ورودی درون خطی را باز می کند که در آن نام متغیر را برای تماشا ارائه می دهید. پس از پر شدن کلید Enter خود را فشار دهید تا به لیست اضافه شود.
ناظر مقدار فعلی متغیر را همانطور که اضافه می شود به شما نشان می دهد. اگر متغیر تنظیم نشده باشد یا پیدا نشود، نشان داده می شود
به روز رسانی متغیرها
با ادامه کار برنامه، مقادیر متغیر ممکن است تغییر کند. لیست تماشا یک نمای زنده از متغیرها نیست مگر اینکه در مرحله اجرا قدم بردارید. هنگامی که با استفاده از نقاط شکست در مرحله اجرا قدم می گذارید، مقادیر مشاهده شده به طور خودکار به روز می شوند. برای بررسی مجدد دستی متغیرهای موجود در لیست، دکمه refresh را در سمت راست عنوان بخش فشار دهید.
همانطور که تجدید درخواست می شود، وضعیت فعلی برنامه دوباره بررسی می شود. هر مورد تماشا شده با مقادیر فعلی به روز می شود.
حذف متغیرها
برای اینکه چیزی را که به دنبال آن هستید به حداقل برسانید تا کار سریعتر انجام شود، ممکن است لازم باشد متغیرها را از فهرست تماشا حذف کنید. این کار را می توان با نگه داشتن متغیر و سپس کلیک بر روی نماد حذف که در سمت راست ظاهر می شود انجام داد.