Welcome to the JavaScript tutorial, we already discussed JavaScript data types. Today we will focus on JavaScript variables. JavaScript variables are not the exception. They are same like other languages like Java, c++, c and etc. The only thing will make it different from the other language is, you can declare the variables as per your wish. The JavaScript variables can hold a string, Boolean, null, and numbers. We can use variables to store the information that you can use as per the need.
Let’s understand the variable with the real world example. Because it will let you understand the quality of variables. What you will think if I will say “Vegetable market” or “ School bag”. Vegetable market will give you an idea that the market belongs to vegetables. The school bag will give you an idea that bag will carry school related stuffs. Likewise the JavaScript variables will have a unique name to resemble different data.
JavaScript Variables – declaration
The variables in JavaScript can be declared with the use of “var” keyword. You can declare variables by two ways.
First way
var sharplesson = “ online tutorials”;
Here, we assigned the value online tutorials to the variable sharplesson.
Second way
var sharplesson;
sharplesson = “online tutorials”;
Here, we first declared the empty variable ‘sharplesson’, and in the second line we have assigned the value.
Points to remember
- Many declarations – You can declare more than one variable in a statement. For example, var sharp=’seo’, lesson=’web-tuts’ and sharplesson=’web-hosting’;.
- If you will not assign value at the time of declaration, then it is having undefined value.
- You can redeclare the Javascript Variables as well.
- The arithmetic operations can be performed with variables.
JavaScript Variables – Scope
The variables scope in JavaScript will be:
Local Scope
If the variable ‘A’ is declared in the function, then the scope of the variable is for that function only. No other function can use ‘A’ variable and its information. For example, Strangers cannot use your personal telephone, because it is your property. It means it is not for public use, it is for person those are in your relation or reside in your house. Here you can say ‘House’ and ‘relation’ are the function, and anyone can access ‘ telephone’ as a variable.
Global scope
If the variable ‘A’ is declared outside of the function, then the scope of the variable is global. It means, you can use the same variable throughout the program code either in the function or outside the function. Let’s take the same telephone example. If that telephone is in public telephone booths, then anyone can pay, and use that phone. It means it is a publicly available thing for every one.
JavaScript Variables – Naming Conventions
If you are naming any variable, then try to remember few things:
- Never use reserved words – You can have any name except the reserved names. Let’s for example, if I will declare ‘var var’, here you can see ‘var’ is already a keyword. So it is not a valid variable.
- Case sensitive – As we know JavaScript is a case sensitive language. So how come variable name will be an exception. For example, ‘SharpLesson’ and ‘sharplesson’ is two different variable for JavaScript.
- Start with alphabets – You should not start the variable name like 78sharp’. It means avoid using numbers at the beginning. You can use alphabets or underscore at the start. For example, ‘sharp’ or ‘_sharp’ is a legal declaration of the variable.
JavaScript Variables – Example
Now we will see the JavaScript variables real use in our practical example. In the below example, we have just shown you the meaning of the local and global variable.
<html >
<head>
</head>
<body>
<script type="text/javascript">
<!--
var SharpGlobal = "global";
sharpMyScope();
document.write(SharpGlobal+" "+" <---this is global declaration");
function sharpMyScope() {
var SharpLocal = "local";
document.write(SharpLocal +" "+" <---this is local declaration <br>");
}
//-->
</script>
</body>
</html>
When you will run this code, then the output will be:
local <—this is local declaration.
global <—this is global declaration.
Do you still want an explanation? Well, for our fresh readers, let me explain things in steps.
Step 1 – We declared the global variable ‘SharpGlobal’ and assigned it a value ‘global’.
Step 2 – We called the function ‘sharpMyScope ()’ that will execute the statement in the function.
Step3 – In sharpMyScope () function, you will see that we have declared the local variable called ‘SharpLocal’.
Step 4 – Now it will show the globally declared variable result.
Step 5– That’s it.
Conclusion
We have just covered JavaScript variables, its scope and naming convention. At last we saw how to use local and global JavaScript Variables. If you will practice, what you learnt today, then it will make your basics strong.