Einige interessante Methoden für Konsolenobjekte



Guten Tag, Freunde!

In dieser kurzen Notiz möchte ich Ihnen Informationen zu einigen Methoden des Console-Objekts mitteilen, die zusammen mit console.log () verwendet werden können.

Eine vollständige Liste der Methoden finden Sie hier .

Von Worten zu Taten. Ja, Chrome wird zum Arbeiten verwendet.

Console.debug () und console.info ()


Console.debug () und console.info () werden verwendet, um Informationsnachrichten an die Konsole auszugeben, und sind tatsächlich Analoga von console.log (). Eine der Funktionen von console.debug () ist, dass die von dieser Methode angezeigte Meldung nur angezeigt wird, wenn die Konsole so konfiguriert ist, dass Meldungen auf Debug-Ebene angezeigt werden (für Chrome ist das Kontrollkästchen Ausführlich auf der Registerkarte Ebenen aktiviert).

Lassen Sie uns einige Objekte erstellen:
const harry = { name: 'Harry', age: 28, married: false, job: 'developer', salary: 300, }, alice = { name: 'Alice', age: 23, married: false, job: 'manager', salary: 100, }, bob = { name: 'Bob', age: 32, married: true, job: 'tester', salary: 200 } 

Listen Sie sie mit console.log in der Konsole auf (harry, alice, bob):


Verwenden Sie jetzt console.debug (), um zusätzliche Informationen bereitzustellen ("\ n" ist das Steuerzeichen für den Zeilenvorschub, das Leerzeichen am Anfang dient zur Ausrichtung):
 console.debug( ' The first employee is', harry.name, '\n The second employee is', alice.name, '\n The third employee is', bob.name ) 

Wir bekommen folgendes:


Verwenden Sie schließlich console.info () mit Platzhaltern ("% s" ist eine Zeichenfolge, "% d" ist eine Zahl, "% s" ist eine Anweisung zum Anwenden von Stilen):
 console.info(' This is %c%s%c. \n He\'s %d years old. \n He\'s %s. \n He works as %s. \n His salary is %d.', 'font-size: 1.2em; font-weight: 600; color: deepskyblue; text-decoration: underline;', harry.name, '', harry.age, harry.married ? 'married' : 'not married', harry.job, harry.salary) 

Ergebnis (beachte den "Harry", den wir in% c eingewickelt haben):


Console.count ()


Console.count () zeigt die Anzahl der Methodenaufrufe mit einer bestimmten Bezeichnung an (die im Methodenparameter übergeben wird). Verwenden Sie console.countReset (), um den Zähler auf den angegebenen Wert zurückzusetzen.

Ein leicht modifiziertes Beispiel mit MDN:
 let user = '' function greet() { console.count(user) return 'hi ' + user } user = 'bob' greet() user = 'alice' greet() greet() console.count('alice') 

Wir sehen folgendes:


Persönlich war ich nicht in der Lage, diese Methode anzuwenden, aber die Gelegenheit schien interessant.

Console.group ()


Console.group () wird zum Gruppieren von Nachrichten verwendet (mit einer Verschiebung nach rechts um eine Ebene). Gruppen können mit Namen versehen werden. Verwenden Sie zum Schließen der Gruppe console.groupEnd (). Console.groupCollapsed () verhält sich wie console.group (), aber die Ausgabe erfolgt in einer minimierten Gruppe (wir arbeiten mit zuvor erstellten Objekten):
 console.groupCollapsed('harry') console.log(harry.name) console.log(harry.age) console.log(harry.married) console.log(harry.job) console.log(harry.salary) console.groupEnd() console.groupCollapsed('alice') console.log(alice.name) console.log(alice.age) console.log(alice.married) console.log(alice.job) console.log(alice.salary) console.groupEnd() console.groupCollapsed('bob') console.log(bob.name) console.log(bob.age) console.log(bob.married) console.log(bob.job) console.log(bob.salary) console.groupEnd() 

Wir bekommen:


Console.table ()


Console.table () zeigt die Daten in einer Tabelle an.

Erstellen Sie ein Array von Objekten:
 let staff = [{ name: 'Harry', age: 29, married: false, job: 'developer', salary: 'many', }, { name: 'Alice', age: 23, married: false, job: 'manager', salary: 'few' }, { name: 'Bob', age: 32, married: true, job: 'tester', salary: 'medium' } ] 

Leiten Sie es mit console.log (Zeug) ab:


Nicht sehr klar, stimme zu.

Verwenden Sie jetzt console.table (stuff):


Eine ganz andere Sache.

Console.time ()


Console.time () startet einen Timer mit dem Namen des übergebenen Parameters. Der Timer wird mit console.timeEnd () gestoppt. Verwenden Sie console.timeLog (), um Zwischenwerte zu korrigieren:
 console.time('time') //    function fact(n) { return n ? n * fact(n - 1) : 1 } console.log(fact(12)) console.timeLog('time') //    function fib(n) { return n <= 1 ? n : fib(n - 1) + fib(n - 2) } console.log((fib(34))) // :      console.timeEnd('time') 

Ergebnis:


Console.trace ()


Console.trace () druckt einen Stack-Trace. Hiermit kann die Reihenfolge der Funktionsaufrufe festgelegt werden.

Ein leicht modifiziertes Beispiel mit MDN:
 foo() function foo() { //  bar() } function bar() { //   baz() } function baz() { //    console.trace('stack traces:') } 

Ergebnis:


Selbst nie benutzt, sondern sich Notizen gemacht.

Das ist alles für mich. Alles Gute.

Source: https://habr.com/ru/post/de484544/


All Articles