Change language

Handling Errors in JavaScript | Tutorial

Handling Errors in JavaScript | Tutorial

Hey Guys! Today were going to be looking at  error handling in JavaScript. So first of all lets just create a normal error in JavaScript, So  were going to say "throw" which is the keyword to actually make the error do something, "new  Error()", which is basically just a normal object in JavaScript thats created whenever an  error appears. So lets just run "node index.js" and as you can see we threw an error. Now these  errors can also have messages in them. So "new Errors(test)". As you can see "Error: Test" so  thats what JavaScript does under the hood. But of course youre not going to interact with errors  like this most of the time. Youre going to see something like lets say, you try to uppercase  a number, which of course is not going to work. So what kind of error do we get? A TypeError!  (1).toUppercase is not a function. Which is true. So as you can see, this is not just an error  its a TypeError and TypeErrors are actually based on the normal error, but are only thrown  if something went wrong with the types you use. So now lets actually try to  handle one of these errors.

So well do that with a try-catch.  So well try setting 1 to uppercase and if that doesnt work were going  to catch the exception that is created. So this is actually the exception/error object  and were just going to console.log the error message. So this will basically cause our program  to not completely halt when an error is created, but to actually just console.log the  message which might sometimes be handy. (I dont know how this ssh command got in  here) "node index.js" as you can see we now didnt throw an actual exception but we just  console-logged the message. Now lets move on! Lets say we now want to do something when  either this ran through [try-block] or this went to a halt [catch-block] this would be  done using the finally block right here. So well just "console.log(final)"  when its done. So lets try this!  "(1).toUppercase not a function" "final".  Now lets also try the other way around so "a".toUppercase; "note index.js" and as you can see now this  worked, so this catch statement wasnt run and we locked final. So that works! Now um  lets get a bit more fancy; Say you have some real special case where you need your own error  so something like a ServiceNotAvailableError.  This would now extend the normal error because  every error in JavaScript extends the normal error, and you also need to give it a name in this  case the name would be "ServiceNotAvailableError". So now youve already created your own custom  error! So if we were to go ahead and say, commented out this try catch right here,  because we dont need it right now, and just say "throw new  ServiceNotAvailableError()" and test this out, as you can see we actually  threw an error! And if you look a bit closer at it, its a ServiceNotAvailableError! So this  would be how you would create custom errors, but now lets actually try to show you how  you would create functions that throw errors. So were just going to rename this real  quick so this is just CustomError now.

And the way we are going to interact with it  now is, that were going to write a function. "dontPutNumbersIn" is the name of the function  and its parameter is "notANumber". So now lets say you want to check if somebody did in fact put  in a number. You would now do something like "if (typeof notANumber == number)" then  youre gonna throw your new exception "throw new CustomError(YOU MONSTER)" So lets try this out! Were going to run  this function "dontPutNumbersIn" and were going to add a string. As you can see  nothing happens and everythings fine. Now were going to put in a number,  because were monsters like that! As you can see we actually threw a little  error right here: "CustomError: You Monster" because, as you see, we did a little check to see  if the input was actually valid. So you did input validation for your variable here and if the  input isnt valid then you just throw an error, to let the programmer know that they  did something wrong. Now of course you could also try-catch this if you wanted to,  like that! Which would of course also work.

Okay so now theres one more thing id like to  show you, which is that you could actually also override the constructor of your errors.  So "constructor(message){...}". So this is basically just a function executed when you  say "new CustomError()" and your message would, in this case, be "You Monster".  So now we could do something like  "if (msg) {super(msg)}". To actually run the  error logic; and if no message was provided, so if its just null or an empty string run  "super(custom error)" or whatever you want.

Now lets try this out! We will actually  "console.log(e .message)" this time, so take a look: "you monster"! Now were  going to remove this "you monster" thingy: "CUSTOM ERROR!". Now were going  to remove our custom constructor as you can see: Now we dont log anything  because the message is actually empty. So i hope you can somehow use this to your  advantage. There are of course a multitude of errors in JavaScript that you could use. Or you could of course create any other number of errors you would like. I hope this was helpful for you and feel free to let me know what you will do with this knowledge.  Im interested. I personally really like the idea of creating custom errors like ServiceNotAvailable  or whatever, because it just makes debugging so much easier! So have fun creating custom errors  in JavaScript now and also have a good day!