Detaillierte Erläuterung der Platzhalter für die Webentwicklung in JS-Zeichenfolgenverkettung und der Conlose-Objekt-API

Detaillierte Erläuterung der Platzhalter für die Webentwicklung in JS-Zeichenfolgenverkettung und der Conlose-Objekt-API

Platzhalter-Ersetzung

Konsolendruck (conlose.log()) oder das Ersetzen von Splicing-Zeichen können mithilfe von Platzhaltern gelöst werden

%s Zeichenfolge
%d / %i Ganzzahl
%f Dezimal (sowohl Ganzzahlen als auch Dezimalzahlen sind zulässig, empfohlen)
%o Objekt
%c Der Stil der Zeichenfolge nach

Beispielcode:

// %s Beispiel let s1 = 'Liebe'
sei s2 = 'Mutterland'
console.log('001--I%s my%s', s1, s2) // -> Ich liebe mein Vaterland // %f und %i, %d Beispiele/*
    Es wird empfohlen, %f zu verwenden. Sowohl Ganzzahlen als auch Dezimalzahlen sind in Ordnung. %d kann nur Ganzzahlen ausgeben und Dezimalzahlen werden direkt ignoriert*/
sei n1 = 100
sei n2 = 5,8
console.log('002--Mir fehlen %d Punkte von %d Punkten', n1, n2) // -> Mir fehlen 5 Punkte von 100 Punktenconsole.log('002--Mir fehlen %i Punkte von %i Punkten', n1, n2) // -> Mir fehlen 5 Punkte von 100 Punktenconsole.log('003--Mir fehlen %f Punkte von %f Punkten', n1, n2) // -> Mir fehlen 5,8 Punkte von 100 Punkten// %oBeispiellet o = { Name: 'Kakashi', Alter: 25 }
console.log('004--Die Informationen des Ninja, der die Mission ausführt, sind %o', o) // -> Die Informationen des Ninja, der die Mission ausführt, sind {Name: "Kakashi", Alter: 25}        
//%c Beispiel var str = '005--Ich bin ein %c Beispiel'
let st = 'Farbe: #000; Hintergrundfarbe: orange; Polsterung: 5px;);'
console.log(str, st)
konsole.log(
    '006--%c------------------Ich bin ein Trenner-----------------',
    „Farbe: rot; Schriftgröße: 10px“
)
reißen>

[Bildübertragung über externen Link fehlgeschlagen. Die Quellseite verfügt möglicherweise über einen Anti-Hotlink-Mechanismus. Es wird empfohlen, das Bild zu speichern und direkt hochzuladen (img-fHD9IthG-1627465023483)(conlose/image-20210728170625837.png)]

Konsolendruck

Das Drucken im Browser ist nicht auf conlose.log() beschränkt;

console Konsolenobjekt ist ein natives Objekt von JavaScript, das verschiedene Methoden zur Interaktion mit dem Konsolenfenster bereitstellt.

In diesem Abschnitt sind nur die Methoden aufgeführt, die meiner Meinung nach häufig verwendet werden.

Tisch()

Mit der Methode console.table können zusammengesetzte Daten zur Anzeige in eine Tabelle umgewandelt werden.

sei o = {
    Benutzername: "kakashi",
    Alter: 25,
    Fertigkeit: [,Chidori‘, ,Erdflusswand‘, ,Sharingan‘]
}
konsole.tabelle(o);

[Bildübertragung über externen Link fehlgeschlagen. Die Quellseite verfügt möglicherweise über einen Anti-Hotlink-Mechanismus. Es wird empfohlen, das Bild zu speichern und direkt hochzuladen (img-9cbDkCtF-1627465023486)(conlose/image-20210728172629214.png)]

Protokoll, Info, Warnung, Fehler

console.log('001 – Ich bin eine normale Ausgabeanweisung');
console.info('002 – Ich bin eine normale Informationsausgabeanweisung');
console.warnen('003 – Ich bin eine Warnausgabeanweisung');
console.error('004 – Ich bin eine Fehlerausgabeanweisung');

[Bildübertragung über externen Link fehlgeschlagen. Die Quellseite verfügt möglicherweise über einen Anti-Hotlink-Mechanismus. Es wird empfohlen, das Bild zu speichern und direkt hochzuladen (img-jluA4C5G-1627465023487)(conlose/image-20210728172305658.png)]

Gruppe(), GruppeCollapsed(), Gruppenende()

console.group() und console.groupend() werden zum Gruppieren angezeigter Informationen verwendet, was für die Ausgabe einer großen Menge an Informationen geeignet ist.

console.group() erweitert standardmäßig die Ausgabeinformationen dieser Gruppe

console.groupend() schließt standardmäßig die Ausgabeinformationen dieser Gruppe

console.group('Erste Ausgaberunde')
console.log('Ich bin die erste Runde der Ausgabeanweisung 1')
console.log('Ich bin die erste Runde der Ausgabeanweisung 2')
console.log('Ich bin die erste Runde der Ausgabeanweisung 3')
console.log('Ich bin die erste Runde der Ausgabeanweisung 3')
console.groupEnd()

console.groupCollapsed('Erste Ausgaberunde')
console.log('1 wird wieder ausgegeben')
console.log('2 wird wieder ausgegeben')
console.log('Es werden noch 3 ausgegeben')
console.groupEnd()

console.log('letzte Ausgabe')

[Bildübertragung über externen Link fehlgeschlagen. Die Quellseite verfügt möglicherweise über einen Anti-Hotlink-Mechanismus. Es wird empfohlen, das Bild zu speichern und direkt hochzuladen (img-XZN4LuIZ-1627465023489)(conlose/image-20210728173352647.png)]

Oben finden Sie den detaillierten Inhalt des Platzhalters für die Web-String-Verkettung und der Conlose-Objekt-API. Weitere Informationen zu Platzhaltern für Web-Strings und der Conlose-Objekt-API finden Sie in den anderen verwandten Artikeln auf 123WORDPRESS.COM!

Das könnte Sie auch interessieren:
  • Eine kurze Diskussion über das Implementierungsprinzip von Webpack4-Plugins
  • Beispielcode für die JS-Funktion „Anti-Shake“ und „Throttling“ zur Entwicklung von Webprojekten
  • Mehrere Lösungen für domänenübergreifende Gründe in der Webentwicklung
  • js zur Realisierung der Web-Message-Board-Funktion
  • Der JavaScript-Artikel zeigt Ihnen, wie Sie mit Webformularen spielen
  • Detaillierte Erläuterung zur Entwicklung von JavaScript-Webseiten auf Einstiegsniveau

<<:  So implementieren Sie Nginx Reverse Proxy und Load Balancing (basierend auf Linux)

>>:  Tutorial zum Anzeigen und Ändern von MySQL-Zeichensätzen

Artikel empfehlen

Erläuterung der JavaScript-Funktionssyntax

Inhaltsverzeichnis 1. Gewöhnliche Funktionen 2. P...

Einführung in die neuen Funktionen von ECMAscript

Inhaltsverzeichnis 1. Standardwerte für Funktions...

Docker-Pull-Image und Tag-Vorgang Pull | Tag

Ich habe den Quellcode des Fabric-Projekts noch e...

Erfahrung im Selbststudium von CSS-Optimierungsfähigkeiten

1. Verwenden Sie CSS-Sprites. Der Vorteil besteht ...

So verwenden Sie display:olck/none zum Erstellen einer Menüleiste

Die Auswirkung der Vervollständigung einer Menüle...

Gründe, warum MySQL 8.0-Statistiken ungenau sind

Vorwort Unabhängig davon, ob es sich um Oracle od...

So verwenden Sie die MySQL-Indexzusammenführung

Die Indexzusammenführung ist ein intelligenter Al...

Detaillierte Erklärung der Fallstricke von MySQL 8.0

Ich habe heute MySQL 8.0 aktualisiert. Das erste ...

Mysql NULL verursachte die Grube

Verwenden von NULL in Vergleichsoperatoren mysql&...

Zusammenfassung der Wissenspunkte zur MySQL-Architektur

1. Datenbanken und Datenbankinstanzen Beim Studiu...

Detaillierte Erklärung zur Verwendung von Teleport in Vue3

Inhaltsverzeichnis Zweck des Teleports So funktio...