Obserwuj zmienne w źródłach

W Narzędziach deweloperskich w Chrome możesz łatwo wyświetlać wiele zmiennych w aplikacji. Obserwowanie zmiennych w sekcji Źródła pozwala Ci zabrać się za konsolę i skupić się na ulepszaniu kodu.

Panel Źródła umożliwia obserwowanie zmiennych w aplikacji. Znajdziesz ją w sekcji oglądania na pasku bocznym debugera. Dzięki tej funkcji nie musisz wielokrotnie rejestrować obiektów w konsoli.

Sekcja Patrz sekcja debugera

Dodawanie zmiennych

Aby dodać zmienną do listy obserwacyjnej, użyj ikony dodawania po prawej stronie nagłówka sekcji. Otworzy się okno wejściowe, w którym podasz nazwę zmiennej do obserwowania. Aby dodać ją do listy, naciśnij klawisz Enter.

Przycisk Dodaj do listy Do obejrzenia

Obserwujący pokaże bieżącą wartość zmiennej po jej dodaniu. Jeśli zmienna nie jest ustawiona lub nie można jej znaleźć, w polu będzie widoczna wartość .

Niezdefiniowana zmienna na liście obserwacyjnej

Aktualizowanie zmiennych

Wartości zmiennych mogą się zmieniać w miarę działania aplikacji. Lista obserwacyjna nie pokazuje zmiennych w czasie rzeczywistym, chyba że przechodzi się przez etap wykonywania. Gdy przechodzisz przez wykonywanie kodu za pomocą punktów przerwania, obserwowane wartości będą aktualizowane automatycznie. Aby ręcznie sprawdzić zmienne na liście, naciśnij przycisk odświeżania po prawej stronie nagłówka sekcji.

Przycisk odświeżania zmiennych obserwacji

Wraz z żądaniem odświeżenia bieżący stan aplikacji jest ponownie sprawdzany. Każdy oglądany element zostanie zaktualizowany o bieżące wartości.

Zaktualizowano obserwowaną zmienną

Usuwanie zmiennych

Aby ograniczyć zakres potrzebnych informacji i szybciej pracować, możesz usunąć zmienne z listy obserwowanych. Aby to zrobić, najedź kursorem na zmienną i kliknij ikonę usuwania, która pojawi się po prawej stronie.

Zmienna kursorem myszy do usunięcia z listy obserwowanych notowań