Heim > Web-Frontend > js-Tutorial > Hauptteil

Detaillierte Einführung in die Funktion console.group() in JavaScript

高洛峰
Freigeben: 2017-02-03 14:53:19
Original
1242 Leute haben es durchsucht

Bei Verwendung von console.log() oder anderen Konsolenausgabefunktionen auf Protokollebene hat die Protokollausgabe keine hierarchische Beziehung. Wenn das Programm viele Protokollausgaben enthält, führt diese Einschränkung zu großen Problemen. Um dieses Problem zu lösen, können Sie console.group() verwenden. Nehmen Sie den folgenden Code als Beispiel:

function doTask(){
    doSubTaskA(1000);
    doSubTaskA(100000);
    console.log("Task Stage 1 is completed");
    doSubTaskB(10000);
    console.log("Task Stage 2 is completed");
    doSubTaskC(1000,10000);
    console.log("Task Stage 3 is completed");
}
function doSubTaskA(count){
    console.log("Starting Sub Task A");
    for(var i=0;i<count;i++){}
}
 
function doSubTaskB(count){
    console.log("Starting Sub Task B");
    for(var i=0;i<count;i++){}
}
 
function doSubTaskC(countX,countY){
    console.log("Starting Sub Task C");
    for(var i=0;i<countX;i++){
        for(var j=0;j<countY;j++){} 
    }
}
doTask();
Nach dem Login kopieren

Das Ausgabeergebnis in der Firebug-Konsole lautet:

Detaillierte Einführung in die Funktion console.group() in JavaScript

Wie Sie sehen können, sollte es eine geben bestimmte hierarchische Beziehung Die Protokollausgabe macht bei der Anzeige keinen Unterschied. Um eine hierarchische Beziehung hinzuzufügen, kann die Protokollausgabe gruppiert werden. Fügen Sie console.group() am Anfang der Gruppierung und console.groupEnd() am Ende der Gruppierung ein:

function doTask(){
    console.group("Task Group");
    doSubTaskA(1000);
    doSubTaskA(100000);
    console.log("Task Stage 1 is completed");
    doSubTaskB(10000);
    console.log("Task Stage 2 is completed");
    doSubTaskC(1000,10000);
    console.log("Task Stage 3 is completed");
    console.groupEnd();
}
function doSubTaskA(count){
    console.group("Sub Task A Group");
    console.log("Starting Sub Task A");
    for(var i=0;i<count;i++){}
    console.groupEnd();
}
 
function doSubTaskB(count){
    console.group("Sub Task B Group");
    console.log("Starting Sub Task B");
    for(var i=0;i<count;i++){}
    console.groupEnd();
}
 
function doSubTaskC(countX,countY){
    console.group("Sub Task C Group");
    console.log("Starting Sub Task C");
    for(var i=0;i<countX;i++){
        for(var j=0;j<countY;j++){} 
    }
    console.groupEnd();
}
doTask();
Nach dem Login kopieren

Konsole einfügen .group( )-Anweisung lautet die Ausgabe in der Firebug-Konsole:

Detaillierte Einführung in die Funktion console.group() in JavaScript

Der Browser unterstützt

console.group() ist dasselbe wie console.log (). Das Debugging-Tool verfügt über eine gute Browserunterstützung und alle gängigen Browser unterstützen diese Funktion.

Eine ausführlichere Einführung in die Funktion console.group() in JavaScript und verwandte Artikel finden Sie auf der chinesischen PHP-Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!