Javascript-fouten:een overzicht

Het beheren van fouten en het debuggen van uw code in Javascript is een van de manieren waarop we ervoor zorgen dat onze code werkt. In dit artikel bekijken we veelvoorkomende manieren waarop we fouten in onze code kunnen opsporen en beheren.

consoles

Console-logboeken zijn de beste manier om te controleren wat er in onze code gebeurt. Console-logboeken kunnen in de meeste browsers worden bekeken door ergens op een webpagina met de rechtermuisknop te klikken en "Element inspecteren" te selecteren. Op het consoletabblad kunnen we alle consolelogboeken van onze Javascript-code zien.

Om een ​​consolelog aan uw code toe te voegen, is de eenvoudigste manier om het volgende te doen:

console.log("Hello!");

Als deze code vanuit ons Javascript wordt uitgevoerd, zien we "Hallo" in onze code. Dit is de meest eenvoudige manier om fouten of berichten te loggen, maar er zijn andere.

Andere handige consoles

We kunnen consolelogboeken gebruiken om te beheren hoe fouten en berichten in onze code worden weergegeven. Laten we eens kijken hoe dat werkt.

Console fouten

Fouten zijn meestal anders gestyled in consoles en laten zien dat er iets belangrijks is gebroken. Meestal zijn deze in het rood gestyled. Dit zal de uitvoering van de rest van uw code niet stoppen. We kunnen een foutmelding weergeven met console.error:

console.error("ERROR!");

Console-waarschuwingen

Vergelijkbaar met fouten, maar meestal in het geel om de gebruiker te waarschuwen dat het verwachte gedrag mogelijk is veranderd. Nogmaals, deze stoppen de uitvoering niet en kunnen als volgt worden uitgevoerd:

console.warning("warning!");

Timing met consoles

Uitzoeken hoe lang een bewerking duurt, kan belangrijk zijn in sterk geoptimaliseerde systemen. Om dat te doen hebben we een aantal consolebewerkingen die we kunnen gebruiken:

console.time("my timer");
console.timeLog("my timer");
console.timeEnd("my timer");

In het bovenstaande hebben we één timer die we "mijn timer" noemen. We kunnen dan tijden loggen tegen "mijn timer", of het helemaal beëindigen. Meer in detail doen deze de volgende dingen:

  • console.time - hierdoor wordt een timer gestart die op de achtergrond "mijn timer" wordt genoemd. U kunt maximaal 10.000 timers hebben.
  • console.timeLog - dit registreert de tijd voor "mijn timer" op dat specifieke punt in de code sinds de timer begon.
  • console.timeEnd - hierdoor wordt "mijn timer" volledig beëindigd, dus we kunnen er geen tijden tegen registreren. Het registreert ook de tijd.

    Fouten in Javascript

    Er zijn een aantal verschillende fouten die Javascript ons kan geven, die ons iets zullen vertellen over wat we verkeerd hebben gedaan:

  • ReferenceError - we hebben geprobeerd te verwijzen naar een variabele die niet bestond.

  • EvalError - er is een probleem opgetreden terwijl we eval() probeerden uit te voeren.

  • TypeError - er is een probleem opgetreden vanwege iets met betrekking tot het type - d.w.z. een functie verwachtte het ene type en kreeg een ander.

  • RangeError - er is een probleem opgetreden toen we probeerden iets aan te roepen buiten het bereik van wat werd verwacht, d.w.z. we noemden een array-element dat niet bestond.

  • AggregateError - een fout die veel fouten bevat.

  • URIError - we hebben een ongeldige URI-tekenreeks of hebben een URI-functie verkeerd gebruikt.

    Breekfouten vermijden

    Deze fouten vertellen ons allemaal iets over waarom onze code ongeldig is. We kunnen fouten voorkomen door code van goede kwaliteit te schrijven en voorwaardelijke instructies te gebruiken om ervoor te zorgen dat variabelen geldig zijn. We kunnen bijvoorbeeld controleren welk type een variabele is gedefinieerd, voordat we deze gebruiken:

let i = 1;
if(typeof i !== "undefined") {
    i += 20;
}

Het controleren van de aanwezigheid van variabelen is een gebruikelijke manier om fouten te voorkomen, vooral als we weten dat de variabele mogelijk niet bestaat, d.w.z. als deze afkomstig is van een API of een externe bron.

Probeer ... Vangen

Een andere manier om fouten te voorkomen, is door try ... catch-statements te gebruiken. De fouten die we noemden in de sectie "Fouten in Javascript" zijn allemaal codebrekend - dat betekent dat de code niet meer werkt als ze worden gegenereerd. Met try ... catch-statements kunnen we wat code proberen, en als het niet lukt, vangen we de fout op. Als de fout het breken van de code was, wordt de code niet meer verbroken en krijgen we gewoon een infobericht in het consolelogboek.

Een dergelijke verklaring kan er als volgt uitzien:

try {
    // This throws an error since i is not defined.
    i += 20;
} catch(error) {
    // We can catch the error so the code will not break, and console log it.
    console.log(error);
}

try ... catch statements worden erg belangrijk wanneer we Node.JS-servers proberen te bouwen. Als er een code-breaking-fout wordt gegenereerd, kan deze de hele server laten crashen - dus we moeten onze fouten op de juiste manier opvangen en afhandelen, om de ervaring niet voor iedereen te verbreken.

Specifieke fouten afhandelen met Try ... Catch

Als we een specifieke fout willen afhandelen, kunnen we deze opvangen en controleren met de instanceof eigendom. Dat ziet er ongeveer zo uit:

try {
    // This throws an error since i is not defined.
    i += 20;
} catch(error) {
    // We can catch the error so the code will not break, and console log it.
    if(error instanceof ReferenceError) {
        console.log("This is a reference error");
    } else if(error instanceof EvalError) {
        console.log("This was an error with the eval() function");
    }
}

Hierdoor kunnen we specifieke acties ondernemen voor specifieke fouten, zodat we de gebruiker een betere ervaring kunnen bieden.

Onze eigen fouten genereren

Stel je een code voor waar we een variabele nodig hebben om te bestaan, of de rest van de code zal breken. We willen misschien onze eigen fouten genereren om te voorkomen dat de code wordt uitgevoerd. We kunnen dit doen met het throw-sleutelwoord, waarbij de tekst na de throw het bericht is dat we willen dat de gebruiker krijgt. Bijvoorbeeld:

if(typeof i == "undefined") {
    throw "Could not find variable i";
}

Deze fout zal een bericht als dit genereren:

Uncaught Could not find variable i

We kunnen zelfs getallen, objecten of booleans gebruiken als onze foutmeldingen. Met behulp van deze techniek kunnen we ook een nieuw foutobject maken, met specifieke berichten:

throw new Error("You made an error");

Dit geeft ons een bericht dat er ongeveer zo uitziet:

Uncaught Error: You made an error at anonymous:1:7

Conclusie

Bedankt voor het lezen van deze handleiding voor Javascript-fouten. Een juiste foutmelding is erg belangrijk in elke taal, en Javscript is geen uitzondering (bedoelde woordspeling ). In deze gids hebben we het volgende behandeld:

  • De verschillende soorten consolelogboeken in Javascript, inclusief waarschuwingen en fouten.
  • Hoe u een bewerking kunt timen met behulp van de console, om uw code mogelijk te optimaliseren.
  • Hoe fouten op te vangen zodat ze niet je hele applicatie kapot maken.
  • Hoe u specifieke berichten kunt geven op basis van typen fouten met behulp van de instanceof commando.