Met Chrome DevTools kunt u eenvoudig meerdere variabelen in uw hele applicatie bekijken. Door variabelen in Bronnen te bekijken, blijft u uit de console en kunt u zich concentreren op het verbeteren van uw code.
Het paneel Bronnen biedt de mogelijkheid om variabelen binnen uw toepassing te bekijken. Deze bevindt zich in het horlogegedeelte van de zijbalk van de debugger. Door gebruik te maken van deze functionaliteit hoeft u niet herhaaldelijk objecten in de console te loggen.
Variabelen toevoegen
Om een variabele aan de watchlist toe te voegen, gebruikt u het toevoegpictogram rechts van de sectiekop. Hierdoor wordt een inline-invoer geopend waarin u de naam van de variabele opgeeft die u wilt bekijken. Zodra het is ingevuld, drukt u op Enter om het aan de lijst toe te voegen.
De watcher toont u de huidige waarde van de variabele terwijl deze wordt toegevoegd. Als de variabele niet is ingesteld of niet kan worden gevonden, wordt deze weergegeven
Variabelen bijwerken
Variabelewaarden kunnen veranderen naarmate een toepassing blijft werken. De watchlist is geen liveweergave van de variabelen, tenzij u de uitvoering stapsgewijs doorloopt. Wanneer u de uitvoering doorloopt met behulp van breekpunten , worden de bewaakte waarden automatisch bijgewerkt. Om de variabelen in de lijst handmatig opnieuw te controleren, drukt u op de vernieuwingsknop rechts van de sectiekop.
Wanneer om vernieuwing wordt verzocht, wordt de huidige applicatiestatus opnieuw gecontroleerd. Elk bekeken item wordt bijgewerkt met de huidige waarden.
Variabelen verwijderen
Om datgene waarnaar u kijkt minimaal te houden en sneller te kunnen werken, moet u mogelijk variabelen uit de watchlist verwijderen. Dit kunt u doen door de variabele te bewegen en vervolgens op het verwijderingspictogram te klikken dat aan de rechterkant verschijnt.