12 Undefined and referenceError – JavaScript for Beginners

Last updated on July 13th, 2020 at 02:41 pm.

12 Undefined and referenceError - JavaScript Tutorial 2018

This video is taken from the full course that will teach you HTML, CSS, Programming concepts and Javascript .

Video Transcript:

Hey, and welcome back.

So an undefined variable is one whereby you have the variable, you have declared the variable, but you haven’t given it a value.

You have not initialized the value of the variable.

And then, a reference error, this is just calling for a variable that does not exist.

So let’s take a look at some examples with the ‘var’ keyword and the ‘let’ keyword.

So if I come back to Firefox, I will open Scratchpad and you can open Scratchpad by Shift+F4 on your keyboard.

So the first thing I want to do, let me declare a variable, variable ‘x’ and then alert the value of ‘x’.

So this, let me just run it and you will see what it will tell me.

So if I run this, you see it gives a value of ‘undefined’.

So we have the variable, it has been declared but we have not initialized the value.

So the next thing again or in this case you can see that the variable was declared first before we tried to use it.

So let me try to use the variable before declaring the value, before declaring the variable.

So if I run this, it’ll give us undefined.

So what’s happening here is something called Variable Hoisting.

So in JavaScript a variable will get hoisted the same way you will hoist a flag.

That’s basically raising it to the top.

So it’ll get hoisted.

We’re going to cover hoisting later on.

So just keep that in mind.

So if I undo this and now let’s look at ‘reference error’.

Now a reference error we said, trying to call a variable that does not exist.

So if I, if I tried to call ‘y’, alert(y) and run this, you’ll see we’ll get this error.

So we get an ‘Exception: ReferenceError’.

So if you try to access a variable that does not exist, a variable that has not been defined yet, you’ll get a reference error.

And now I want to use ‘let’.

So let me see if I use let x; and then alert(x); what will happen.

So if I run this, it’ll give us a syntax error.

Okay, this is the same thing we experience before.

So let me use a different variable.

Let me use ‘z’ and then alert(z).

And then we run this, it’ll give us ‘undefined’.

So you remember in the other video, in the other example just before this, we were able to put alert before ‘let’ and we got, we got a value of ‘undefined’.

What happens if we try to do the same with a variable that has been declared with ‘let’.

So if you try to run this, it’ll give you, okay let me use a different variable first of all.

Let me say ‘a’, ‘a’.

So alert(a); and then we try to declare ‘a’ with ‘let’ before we try to call it.

So if I run this, it gives us a reference error unlike for ‘var’.

If you were to use ‘var’, if you were to use ‘var’ here, this variable would get hoisted to the top.

So if you don’t want your variables to get hoisted, you will use the ‘let’ keyword.

So to hoist, basically we’ll define this variable at the top of the code.

All variables that are declared with ‘var’ or without the ‘var’ keyword, they’re always elevated to the top.

So that’s what’s happening, what’s happening in here.

If you use ‘let’, it will not be elevated to the top.

We’re going to cover variable hosting later on.

So in this video, we’ve taken a look at ‘undefined’ and ‘reference error’ whereby, ‘undefined’ basically means the variable is there, yes.

It has been defined but it has not been, it has not been given an initialization.

It has not been given a value.

And then for reference error, that’s a variable that does not exist and if you try to call it, it cannot be found in the system, in the memory.

So let’s continue in the next video.

This section is from Learn Javascript from Scratch.

Learn Javascript from Scratch

Comment Here

Need WordPress help? Linux Server help? Talk to us.

  • We are your own WordPress customer service.
  • We set up Linux servers and install or migrate WordPress. Learn more here.
  • We support WooCommerce too.
  • Check out our WordPress customer support plans here or contact us below .

If you have any questions regarding WordPress support, Linux server support or any of our services, feel free to reach out or read more on our services page.

Join this free course:

How to host multiple WordPress
websites on a VPS

Close me!