Ext.js - Debuggen von Ext JS-Code

Jeder JavaScript-Code kann mit debuggt werden alert() Box oder console.log() oder mit dem Debug-Zeiger in einem Debugger.

Warnbox

Platzieren Sie ein Warnfeld im Code, in dem Sie den Fluss oder einen beliebigen Variablenwert überprüfen möchten. Zum Beispiel alert ('Nachricht zum Anzeigen' + Variable);

Entwicklungs- / Debugging-Tool

Der Debugger ist das wichtigste Tool für jeden Entwickler, um das Problem und den Fehler im Code während der Entwicklung zu überprüfen.

Ext JS ist ein JavaScript-Framework und kann daher problemlos mit Entwicklertools getestet werden, die von verschiedenen Browsern bereitgestellt werden oder für diese spezifisch sind. Allen gängigen Browsern stehen ihre Entwicklertools zum Testen und Debuggen von JavaScript-Code zur Verfügung.

Beliebte Debugger sind das IE-Entwicklungstool für IE, Firebug für Firefox und das Chrome-Entwicklungstool für Chrome-Browser.

Der Chrome-Debugger wird mit dem Chrome-Browser geliefert. Firebug muss jedoch speziell installiert werden, da er nicht als Paket mit Firefox geliefert wird.

Hier ist ein Link zum Installieren von Firebug für Firefox-Browser http://getfirebug.com

Die Verknüpfung zum Öffnen des Entwicklungstools unter Windows ist die Tastaturtaste F12.

JS-Code im Debugger debuggen

Es gibt zwei Möglichkeiten, JavaScript-Code zu debuggen.

• Der erste Weg ist zu platzieren console.log() im Code und sehen Sie den Wert des Protokolls, das in der Konsole des Entwicklungstools gedruckt wird.

• Der zweite Weg ist die Verwendung von Haltepunkten im Entwicklungstool. Es folgt der Prozess.

  • Öffnen Sie die Datei in allen verfügbaren Skripten unter Skript-Tag.

  • Setzen Sie nun einen Haltepunkt auf die Zeile, die Sie debuggen möchten.

  • Führen Sie die Anwendung im Browser aus.

  • Wenn der Codefluss diese Zeile erreicht, wird der Code unterbrochen und bleibt dort, bis der Benutzer den Code mit den Tasten F6 (zur nächsten Codezeile), F7 (innerhalb der Funktion) oder F8 (gehen) ausführt zum nächsten Haltepunkt oder führen Sie den Code aus, wenn keine Haltepunkte mehr vorhanden sind), basierend auf dem Ablauf, den Sie debuggen möchten.

  • Sie können die Variable oder die Funktion auswählen, deren Wert Sie sehen möchten.

  • Sie können die Konsole verwenden, um den Wert zu überprüfen oder um einige Änderungen im Browser selbst zu überprüfen.