Javascript part 17

Jonathan Bleibdrey

5 min readMar 29, 2021

Today we talk about Strict mode and Error handling.

strict mode - tightens the behavior in javascript, it keeps the code safer and might help with performance.

we use strict mode by putting it on top of your folder like this:

“use strict”;

you could also use it at the beginning of a function like so:

In this example, we put strict mode on, and already, it's giving us errors! If you see below, I call my function, and it says “y” is not defined. That's because we didn't give it a “var, let, const” keyword before we declared a variable. So, in the next function, we do declare the “y” variable with the var keyword, and it passes it through and works fine. (basically a safety net for noobs, like me!)

Fun fact: In strict mode, we can not delete a variable, which in normal javascript, you can. Read on for examples.

If you look at the example below, it’s giving us a warning saying “unexpected token var, const, and let.” because we used strict mode with the keywords “use strict” before all of the variables.

In the last example, it does fire because I took off “use strict,” and In normal javascript, you can delete it with the “delete ” word.

(I never use strict mode unless it's already built in a framework. But I can see where it could be useful and un-useful.)

Moving on!

In this next example, in strict mode, it will give us an error in a function because you cant use two of the same argument names.(we put two A’s)

(I personally never use it or go out of my way to use it.)

Error handling:

Errors can come from many different areas like the actual programmers, due to wrong input or other miscellaneous things.

error handling is used most when doing fetch calls, ajax calls, or async code(async/await)

It uses these keywords:

try{}- this will allow you to test a block of code for errors.

catch{}- this allows you to handle the error

throw{}-lets you use custom errors to show to the user

finally{}- lets you execute code or function after catching an error, regardless of the error.

Let me show you in an example above:

first, we set up the “try{}” block; we see in the console.log that it starts with “start to run.” so our fetch call has started.

Then hits a snag on a unicycle, which we never actually defined. Then it hops over to the “catch{}” block. It takes in an object as an argument which is an “error or err for short.” Then outputs whatever went wrong with the argument “err. stack”.(we can also do “err” without the stack, basically it will return whatever went wrong.)

You can also see it doesn't run any other code once it catches an error. We can tell because we never actually hit our console.log(“end of try run — never reached”).

Next, it hops over to the “finally{}” block and runs a function that you want to fire off if everything fails. In our case, we ran a console.log(“this always run “).

Finally, it runs the rest of the code in our component or HTML.

LAST NOTE: make sure your code is runnable, aka make sure there are no syntax errors. There cant be any parse time errors. The “try-catch” only handles run-time errors.

OK next!

We will show you how to use a“ throw” method. Here we are making some fake JSON data or variables. We set the key to “age” and 30 as the value.

We do our “try{}” block which parses the JSON, which changes the data string to an object in the user variable.

Next, an if statement, that says if “user. name” doesn't exist or is not there.

“throw” new SyntaxError().

(this can be anything, like a string saying “nope didn't work, missing name variable,” but we created a “new SyntaxError.” so don't let it scare you.)

After that, we hit our “catch{}” block which is a console.log() with “JSON error:” plus the error message we got snagged on.

(which we set up early in the throw method).

That's it, we quickly change the fake JSON data to have a key of name and a value, and it works perfectly fine.

Ok thank you for hanging out i am uploading new info soon, so stick around.

check out some javascript….

Javascript 1 (variables and data types)

Javascript 2 (numbers and strings)

Javascript 3 (bracket notation and 20 diff string methods)

Javascript 4 (functions and how they work)

Javascript 5 (hoisting, comparison operators, and if-else statements)

Javascript 6 (diff. Equal signs, null, and undefined)

Javascript 7 (logical operator, &&, || and ternary operators)