Wenn Ihnen meine Artikel gefallen, können Sie mir einen Kaffee spendieren :)

Die Konsolen-API wird zum Debuggen, Drucken von Nachrichten und zum Übertragen verschiedener Informationen an die Konsole verwendet, insbesondere in JavaScript-Laufzeiten wie Browsern und Node.js. Um die Konsolen-API jedoch korrekt verwenden zu können, müssen Sie genau wissen, was die Konsolen-API ist.

In diesem Artikel erkläre ich Ihnen die Konsolen-API. Konsolen-API ist ein Objekt. Dieses Objekt hat Schlüssel, und wenn Sie eine Konsolenmethode schreiben, greifen Sie auf den Wert eines Schlüssels im Konsolenobjekt zu.

Jetzt werde ich es Ihnen erklären, indem ich mein eigenes Konsolenobjekt codiere, damit Sie die Logik verstehen können, wie die Protokollmethode in der Konsolen-API funktioniert.

const customConsole = {
    log: function(message) {
        const timestamp = new Date().toISOString();
        const output = `[${timestamp}] LOG: ${message}`;
        alert(output); // Displaying the output (replace with console.log in a real scenario)
    }
};

customConsole.log("Hello, this is a custom console log!");

Versuchen Sie, den Code zu lesen. Wie im Code zu sehen ist, habe ich ein benutzerdefiniertes Konsolenobjekt erstellt und einen Schlüssel für dieses Objekt definiert, und der Wert dieses Schlüssels ist eine Funktion. Dann habe ich auf den Protokollschlüssel dieses Objekts zugegriffen.

Daher verfügt die Konsolen-API nicht nur über eine „Log“-Methode. Wie viele sind es also? Finden wir es jetzt heraus.

Wie auf dem Foto zu sehen ist, verfügt das Konsolenobjekt über mehr als einen Schlüssel und die Werte dieser Schlüssel. Diese Werte sind Funktionen.

Wir können auf diese Funktionen mit dem Konsolenobjekt zugreifen.

console.error()
console.warn()

Jetzt lernen wir, was einige dieser Funktionen bewirken.

1. console.debug()

console.debug , eine Funktion in JavaScript, die für Debugging-Zwecke in der Browserkonsole verwendet wird. Standardmäßig ist die Ausgabe der Methode console.debug() in den Chrome-Entwicklertools nicht sichtbar.

Beispiel :

function subtract(a, b) {
    console.debug("subtract function called:", { a, b });
    const result = a - b;

    if (result > 0) {
        console.debug("Result is positive.");
    } else if (result 



Ausgabe : 



Die Ausgabe der console.debug()-Methode ist in den Chrome-Entwicklertools nicht sichtbar.



  
  
  2. console.error()


Es handelt sich um eine in JavaScript verwendete Methode, um Fehlermeldungen an die Konsole zu drucken. Es wird verwendet, um das Debuggen zu erleichtern, wenn ein Fehler auftritt. Die Nachricht erhält möglicherweise eine spezielle Formatierung, z. B. rote Farben und ein Fehlersymbol.

Beispiel :


async function fetchData(ıd) {
    try {
        const response = await fetch(`https://jsonplaceholder.typicode.com/posts/${ıd}`);

        if (!response.ok) {
            throw new Error(`HTTP error! status: ${response.status}`);
        }

        const data = await response.json();
        console.log("posts data fetched successfully:", data);
        return data;

    } catch (error) {
        console.error(" error posts data :", error.message);
    }
}

fetchData(1);





Wenn beim Abrufen der Daten ein Fehler auftritt, ist dies die Ausgabe: 





  
  
  3. console.warn()


Es handelt sich um eine Methode, die in JavaScript verwendet wird, um potenzielle Probleme oder Situationen, die Aufmerksamkeit erfordern, auf der Konsole auszugeben. Es wird verwendet, um das Debuggen zu erleichtern, wenn ein Fehler auftritt. Die Nachricht erhält möglicherweise eine spezielle Formatierung, z. B. gelbe Farben und ein Warnsymbol.

Beispiel :


  if (password.length 





  
  
  4. console.dir()


Die Methode console.dir() zeigt eine Liste der Eigenschaften des angegebenen JavaScript-Objekts an. In Browserkonsolen wird die Ausgabe als hierarchische Auflistung mit Dreieckssymbolen dargestellt, mit denen Sie den Inhalt untergeordneter Objekte sehen können.

Beispiel :


const basket =  {
    name : "t-shirt",
    price : 100,
    quantity : 1,
    color : [ "blue" , "red" , "yellow"],
    size : [ "xs" , "s" , "m" , "l" , "xl"],
    total : function() {
        return this.price * this.quantity;
    }

}

console.dir(basket)




Ausgabe : 





  
  
  5. console.dirxml()


Die Methode console.dirxml() zeigt einen interaktiven Baum der Nachkommenelemente des angegebenen XML/HTML-Elements an. Wenn die Anzeige als Element nicht möglich ist, wird stattdessen die Ansicht JavaScript-Objekt angezeigt. Die Ausgabe wird als hierarchische Liste erweiterbarer Knoten dargestellt, mit der Sie den Inhalt untergeordneter Knoten sehen können.

Beispiel :


console.dirxml(document.body);




Ausgabe :





  
  
  6. console.assert()


Die Methode console.assert() schreibt eine Fehlermeldung an die Konsole, wenn die Behauptung falsch ist. Wenn die Behauptung wahr ist, passiert nichts.

Beispiel :


consolle.assert("a" === "f" , error message)




Ausgabe : 





  
  
  7. console.count()


Die Methode console.count() protokolliert, wie oft dieser bestimmte Aufruf von count() aufgerufen wurde.

Beispiel :


function greet(user) {
  console.count();
  return `hi ${user}`;
}

greet("micheal");
greet("roman");
greet();
console.count();




Ausgabe : 





  
  
  Abschluss


Wenn eine Bedingung nicht wahr ist, wird eine Fehlermeldung ausgegeben. Wenn die Bedingung wahr ist, wird nichts gedruckt.