Programmeringsfeil er uunngåelige. Før eller siden vil applikasjonen din oppleve noe uventet oppførsel. Som alle andre programmeringsspråk, gir JavaScript feil når noe går galt i koden din.

Feil forstyrrer den normale flyten til en applikasjon. Men de bidrar også til å beskytte applikasjonen din mot uforutsigbar oppførsel. Å vite hvordan man håndterer feil riktig er avgjørende.

Hvorfor er feilhåndtering viktig?

Feilhåndtering bidrar til en forbedret brukeropplevelse. Du kan bytte ut JavaScripts standard- og noen ganger detaljerte feil med mer lesbare feilmeldinger. Du kan på en elegant måte håndtere årsakene til noen feil og holde programmet i gang i stedet for å avslutte det.

Feilhåndtering er også nyttig under utvikling. Du kan fange en kjøretidsfeil og gjøre noe nyttig med den, for eksempel logger den på nettleserkonsollen. Dette er mer grasiøst enn feilen som forårsaket en krasj og ikke vet hvor eller hvorfor feilen oppsto.

Struktur for innebygde JavaScript-feil

JavaScripts feil er objekter med tre egenskaper:

  • Navn: Dette er navnet på feilen. For eksempel vil et manglende variabelnavn gi en feil kalt SyntaxError.
  • beskjed: Dette er brødteksten i meldingen og forklarer feilen tekstmessig.
  • årsaken: Du kan bruke denne egenskapen med tilpassede feil for å holde styr på anropsstakken.

Vanlige typer feil i JavaScript

Her er noen vanlige feil funnet i JavaScript.

Syntaksfeil

Syntaksfeil kan oppstå når JavaScript prøver å tolke koden din. Det vil gi en feilmelding hvis koden din ikke samsvarer med riktig syntaks. Noen vanlige feil som kan føre til syntaksfeil er:

  • Mangler variabelnavn.
  • Mangler "}" etter en funksjon.
  • Mangler ")" etter en betingelse.

ReferenceError

Referansefeil oppstår når et program prøver det referer til en variabel som er utilgjengelig eller utenfor omfanget.

TypeError

JavaScript kan gi en typefeil når den ikke kan utføre en operasjon fordi typen den forventer er forskjellig fra den den mottar.

URIfeil

Denne feilen oppstår hvis du bruker en global URI-håndteringsfunksjon – som decodeURIComponent() – feil. Som et resultat mislykkes kodingen eller dekodingen.

AggregateError

Denne feilen brukes til å representere flere feil pakket inn i én. Bruk den når du vil kaste mange feil samtidig. For eksempel kan Promise.any() kaste en AggregateError() når alle løfter som er gitt til den avviser.

Intern feil

En intern feil oppstår når det oppstår en feil inne i JavaScript-motoren.

RangeError

Noen funksjoner dikterer rekkevidden av verdier du kan sende som argumenter. Denne feilen oppstår når du prøver å sende en verdi som ikke er inkludert i det området.

Feilhåndtering med prøven... Fangstblokk

JavaScript gir innebygd funksjonalitet for håndtering av unntak med prøv... fange... til slutt blokkere. Det lar deg også ta opp dine egne feil ved å bruke kaste operatør.

Du kan bruke en try...catch-blokk for å håndtere feil som oppstår under kjøring. Du skriver gyldig kode som du forventer å kjøre riktig i try-blokken. I catch-blokken kan du skrive feilhåndteringskode.

prøve {
// Gyldig Javascript-kode
} å fange (feil) {
// Håndteringsfeil
} til slutt {
// Utføres selv når det oppstår en feil
}

Fangstblokken ignoreres hvis koden i prøveblokken ikke gir noen feil. Hvis det oppstår en feil, hopper utførelsen til catch-blokken. Koden i den endelige blokken kjører enten det oppstår en feil eller ikke. Denne blokken er ikke obligatorisk, så slipp den hvis du ikke trenger den.

Koden du tar med i prøveblokken må være gyldig. Hvis det ikke er det, vil JavaScript gi en analysefeil.

La oss se på et praktisk eksempel:

prøve {
konsoll.log (tekst)
} å fange (feil) {
konsoll.Logg(feil.beskjed)
} til slutt {
 console.log("Vil bli utført uansett")
}

Dette programmet prøver å logge verdien til tekstvariabelen. Siden den variabelen ikke er definert, vil programmet gi en feil. Denne feilen er trykt på konsollen i fangblokken. Den endelige blokken kjører deretter og skriver ut en egen melding.

ReferenceError: tekst er ikke definert
Vil bli utført uansett

I situasjoner der du trenger å ta opp din egen feil, bruk kaste operatør.

Tenk på dette eksemplet som gir en feil hvis dataene er falske:

konst data = getData()
prøve {
 if (!data) {
 kaste "Ingen data"
 }
konsoll.log (data)
// Fortsette
} å fange(feil) {
konsoll.log (feil) // "Ingen data"
}

I dette eksemplet kaller programmet getData()-funksjonen og tildeler resultatet til datavariabelen. I prøveblokken gir blokken en egendefinert feil hvis dataene er tomme. Fangstblokken fanger opp den feilen og logger den til konsollen.

Å kaste feil er veldig gunstig under utvikling. Du kan bruke den tilpassede feilmeldingen for å forstå hvorfor applikasjonen din ikke fungerer som forventet.

Som dette eksemplet viser, kan du bruke en streng for feilobjektet. Du kan faktisk kaste et hvilket som helst JavaScript-uttrykk som en feil. Av hensyn til konsistensen med innebygde feil, bruk imidlertid et JavaScript-objekt som inneholder et navn og en melding.

kaste {
 Navn: "Feilnavn", 
 beskjed: "Feilmelding"
}

Du kan også bruke JavaScripts innebygde konstruktører når du kaster feil. Disse konstruktørene inkluderer blant annet Error, SyntaxError og ReferenceError.

For å sende en feil ved å bruke feilkonstruktøren, bruk denne koden:

kastenyFeil("Ingen data")

Du kan nå referere til navnet og meldingen.

konsoll.log (feil.navn) // Feil
konsoll.log (feil.melding) // Ingen data

Utvide JavaScript-feilobjektet

En tilpasset feilklasse kommer godt med når du håndterer feil som ikke samsvarer med objektene som allerede er levert av JavaScript. For eksempel vil du kanskje isolere en datavalideringsfeil som en spesifikk type kalt ValidationError.

Du kan bruke en JavaScript ES2015 klasse for å lage en egendefinert feilklasse.

klasseValideringsfeilstrekkerFeil{
konstruktør(beskjed) {
super(beskjed);
 dette.navn = "Valideringsfeil";
 }
}

Kast en feil ved å bruke ValidationError-klassen slik:

kasteny ValidationError ("Din feilmelding")

Den kastede feilen vil være et objekt med navn og meldingsverdier.

{
 Navn: "Valideringsfeil",
 beskjed: "Din feilmelding"
}

Feil er der for å hjelpe

Feilhåndtering er en grunnleggende del av programmering, uansett hvilket språk du bruker. JavaScript har god støtte for å heve og fange opp feil i stil med unntak. Den har også flere innebygde feiltyper som du kan håndtere og bruke til dine egne saker.

Noen feil som syntaksfeil kan forbli uoppdaget når du skriver JavaScript i "slurvet modus". Ved å bruke streng modus kan JavaScript fange opp feil som den ellers ville ha ignorert.