Bekijk variabelen in Bronnen

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.

Bekijk het gedeelte van de debugger

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.

Knop Toevoegen aan volglijst

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 voor de waarde.

Ongedefinieerde variabele in de watchlist

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.

Knop Watchvariabelen vernieuwen

Wanneer om vernieuwing wordt verzocht, wordt de huidige applicatiestatus opnieuw gecontroleerd. Elk bekeken item wordt bijgewerkt met de huidige waarden.

Bijgewerkte variabele die wordt bekeken

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.

Beweeg de variabele om deze uit de volglijst te verwijderen