programminghead Logo

JavaScript Tutorial 3 : JavaScript Variables

JavaScript Variables :

Variables in JavaScript like a Container for Data values, which can store data for current program.
JavaScript Variable can store numbers, strings and Boolean values.

Declaring Variables in JavaScript :

In JavaScript Variable declaring is Easy. You just have to write var (stands for Variable) and then assign any name to your Variable.
You can write your variable according to your imagination And you also can Declare multiple variable in one line like (var myvar1, myvar2, myvar3;) but there is sum rules you have to keep in mind while Declaring or assigning Name for Variables in JS.

Rules for assigning Variable Names :

Rule 1: Variable are Case Sensitive
variables are Case sensitive, so Myvariable is compliantly different from myvariable.
Rule 2: Variables Name can not start with a number
while Declaring Variable you have to sure about there is not any number at the bigging of variable name. you can use number after or at the middle the Variable name like ( var data1;) but not at the beginning (var 1data;). Rule 3: The ampersand (&) character is not a valid for variable names
Yes The ampersand (&) character is not a valid character for variable names, you can't use THe The ampersand (&) character in Variable name.

Valid and Invalid Variable names :

Valid Variable names Example :


var _myvariable;
var myvar1;
var var_one;

Invalid Variable Names Example :


var 1myvar;
var var&data;

Variables syntax In JS

Variable syntax is very simple but in this Example I'm going to write 2 syntax one for Internal JavaScript in HTML Document and other one for External JavaScript file (.js file).
This is not that impotent to declare these Variable syntax separately but it will help beginners to understand better.

JS Variable Syntax for Internal JS in HTML


<html>
 <head>
  <title>Variables in JS</title>
 </head>
 <body>

   <script type="text/javascript">
     var myName;
     var myHobby1,myHobby2,myHobby3;
   </script>

 </body>
</html>

JS Variable Syntax for Internal .js file


   var myName;
   var myHobby1,myHobby2,myHobby3;

Assigning Value to JS Variables :

After Declaring a Variable in JS we Have to Assign Data to our Variable Otherwise Variable remains Undefined/Empty. We can assign values Like (string/numbers/boolean) To our Variable after the equal sign. var a=10;
so we can access those Values by calling that variable with the Value we need.
Like a have a 3 Variable called my Address (address1,address2,address3) with my address details.
and i want to output my 3rd address. so in JS except writing that long 3rd address again i can just call the Variable with my 3rd address in my program to save time and my strength. :p

Assigning String Values to JS Variables


<html>
 <head>
  <title>String Variables in JS</title>
 </head>
 <body>

   <script type="text/javascript">

     var myAddress1,myAddress2,myAddress3;
     myAddress1 = "house number 0, Fav Street, HUMANcountry";
     myAddress2 = "house number 1, Clean Street, Mycountry";
     myAddress3 = "house number 3, My Street, People'scountry";

     document.write("my 3rd Address = "+myAddress3);
   </script>

 </body>
</html>	

You also can assign values in the same line or while declaring variables like
var address="hose number, street name, country";
after the Variable names but for better understanding i had declared all variable once and the values after the Declaration.

+ Concatenation sign in Code :

This + sign is Called concatenation in JavaScript. Which is used in JS to Concatenate/join two data like variable and String data or multiple Variables in JS.
Basically it Allows/Join string and Variable at one line. If we write string and Variable without This + Concatenation sign in Code
document.write("string value " variable1);
You will face error like

Uncaught SyntaxError: missing ) after argument list
in the Console log Tag.
To prevent your program from that error and joint string and variable we have to write 2 document.write() JS attributes (one for the String data and other one for the Valribale data) or we can join then using JS + Concatenation sign.

Variables in JS (Number)

Number in Variable Example


<html>
 <head>
  <title>Numbers Variables in JS</title>
 </head>
 <body>

   <script type="text/javascript">

     var phoneNo1=1112224;
     var phoneNo2=9992234;
     var phoneNo3=9994444;

     document.write(phoneNo2+" is my 2nd Phone Number <br/> and 3rd ="+phoneNo1 +" and 1st ="+ phoneNo3);
   </script>

 </body>
</html>	

Results


Variables in JS (Boolean)


<html>
 <head>
  <title>Boolean Variables in JS</title>
 </head>
 <body>


   <script type="text/javascript">

     var a=true;

    if(a==true){
       document.write("Variable A is True");
       }
    else{
       document.write("Variable A is False");
       }
   </script>
 </body>
</html>	

Results

Boolean data is basically used for storing TRUE or FALSE value for we can show output according to those values. Here i have to use IF ELSE Condition if you want to know about HTML Conditions Like IF ELSE Conditions Click Here.

Types of Variables :

We know that JS Variables can store 3 Types of Data (Numbers,Strings,Boolean Data) but There Is Two Type of Variables in JavaScript.

1. Local Variable

2. Global Variable


1. Local Variable

Local variables are those variables who cab be accessed Locally. Variable with limitations Like Variable inside a Function ( to know about Functions click here).
So that's variable can be accessed inside the Local Function.

Local Variable Example


<html>
 <head>
  <title>Local Variables in JS</title>
 </head>
 <body>


   <script type="text/javascript">

    myname();

    function myname(){
      var name="ProgrammingHead";
      document.write("inside = "+ name);
    }

     document.write("outside = "+ name);

   </script>
 </body>
</html>	

Results

myname()

in JavaScript we have to Write function name like (myname();) in order to run a function. learn more about functions Click here.


In this Example i Have created a Variable called name inside a function called myname(). So by retrieving data from inside myname() function (document.write("inside = "+ name);) we have our Variable data in Results but retrieving the same data from same Variable from outside myname() function we have empty variable Value.
Because that variable was a Local Variable. so Local variable data can be Accessed Locally.

Global Variable :

Global Variable are like most of the Variable used for storing Values but Global Variable's data can Be accessed Globally in a Program.
Basically Declare some Variables at the Beginning/Header part in the Program and outside any Function. By doing that Variable can be Accessed Globally (Accessed inside and Outside of any Function).

Global Variable Example


<html>
 <head>
  <title>Global Variables in JS</title>
 </head>
 <body>


   <script type="text/javascript">

    var name="ProgrammingHead";
    myname();
    function myname(){
      document.write("inside = "+ name);
    }

     document.write("outside = "+ name);

   </script>
 </body>
</html>	

Results

Comments

minecraft pc download

http://tinyurl.com/yy6v9kjj
05:05 am

Does your website have a contact page? I'm having problems locating it but, I'd like to send you an email. I've got some ideas for your blog you might be interested in hearing. Either way, great blog and I look forward to seeing it grow over time.

minecraft download

http://tinyurl.com/yxdwgw57
12:39 pm

Hello! I simply want to give you a big thumbs up for the great information you have right here on this post. I will be coming back to your site for more soon.

download minecraft free

http://tinyurl.com/yy7dp7wk
03:11 am

When someone writes an article he/she maintains the image of a user in his/her brain that how a user can be aware of it. Thus that's why this article is amazing. Thanks!

g

http://bit.ly/3078WYE
01:15 am

Fantastic website. Plenty of helpful info here. I'm sending it to several pals ans also sharing in delicious. And of course, thanks on your effort!

g

http://tinyurl.com/y6pkqhjw
07:06 pm

Wow, incredible blog layout! How long have you been blogging for? you make blogging look easy. The overall look of your site is great, let alone the content!

g

http://tinyurl.com/yxs3x7gr
09:50 am

This is a topic that is close to my heart... Best wishes! Where are your contact details though?

how to download minecraft free

http://tinyurl.com/y6j4sfhg
07:42 am

Remarkable! Its actually amazing paragraph, I have got much clear idea on the topic of from this article.

g

http://j.mp/2JvwNv7
01:08 pm

Incredible points. Great arguments. Keep up the great spirit.

free minecraft download

http://tinyurl.com/y6omjxwa
05:53 am

Why users still make use of to read news papers when in this technological world the whole thing is available on web?

minecraft free

http://tinyurl.com/y2pw2aaw
08:32 pm

What's up, I check your blog daily. Your humoristic style is awesome, keep up the good work!

minecraft download pc

http://j.mp/2WnX5TW
01:29 am

Very energetic blog, I enjoyed that a lot. Will there be a part 2?

gamefly free trial

http://tinyurl.com/y4hnkmvs
02:22 pm

I am sure this piece of writing has touched all the internet visitors, its really really nice post on building up new web site.

gamefly free trial

http://tinyurl.com/yxu5cmnl
12:06 am

Paragraph writing is also a excitement, if you know then you can write or else it is difficult to write.

gamefly free trial

http://tinyurl.com/y5jh64n7
06:04 pm

When I initially commented I appear to have clicked on the -Notify me when new comments are added- checkbox and now whenever a comment is added I get four emails with the same comment. There has to be a means you are able to remove me from that service? Cheers!

gamefly free trial

http://j.mp/2LeOly6
07:38 am

Great weblog here! Additionally your web site rather a lot up fast! What host are you using? Can I am getting your affiliate hyperlink to your host? I wish my site loaded up as quickly as yours lol

gamefly

http://bit.ly/2GUzkgO
12:54 am

Hello there! Do you know if they make any plugins to help with Search Engine Optimization? I'm trying to get my blog to rank for some targeted keywords but I'm not seeing very good gains. If you know of any please share. Thanks!

Write to Us