JavaScript Variables

JavaScript Variables: Every computer language provides some kind of support for variables. In JavaScript, programmers use the var statement to create a new Javascript variable. When you create a JavaScript variable, you need to give it a name. This is just like putting labels on the food containers in your refrigerator. When you look at the label, you can see what is inside without having to open the container.

The term var indicates that the computer should create a variable. The word greeting is the name that I gave the variable. This line ends with a semicolon, as most lines do. After interpreting this line of code, the computer generates in memory a chunk of space named greeting. Thereafter, you can write code that writes new values to the memory chunk, and write code that reads the values from the chunk. The following are all valid JavaScript Variables

var x; 
var myVar; 
var counter1; 

The following JavaScript Variables names are invalid:

var 1stCounter; 
var new variable; 
var new.variable; 
var var; 

You can declare multiple JavaScript Variables on the same line of code, as follows:

var x, y, zeta; 

These can be initialized on the same line, too:

var x = 1, y = "hello", zeta = 14; 

Guidelines for Naming JavaScript Variables

Computer programmers get to name a lot of things. Experienced programmers have established a few naming conventions. You might want to keep these guidelines in mind: Be careful about case. In many languages (including JavaScript), username, userName, and USERNAME are all completely different variable names.

Make names descriptive. You probably shouldn’t use a name such as r or x, because later it will be hard to remember exactly what the variable is supposed to contain. Names such as taxRate or greeting will make your code much easier to follow. Don’t use spaces or punctuation. Most languages don’t allow multiword variable names.

Many programmers use capitalization (taxRate) or underscore characters (tax_rate) to make multiple word variable names easier to read. Many of the punctuation characters have special meanings, so it’s not a good idea to put these in a variable name.

Don’t make your variable names so long that they are impossible to type correctly. Many programmers prefer variable names from 5 to 15 characters long.

Assigning a Value to a JavaScript Variables

Take a look at this line from the Hello Joe program:

greeting = "Hi there, Joe"; 

Essentially, this line assigns the text “Hi there, Joe” to the JavaScript Variables greeting. Everything between the quotation marks is called a string literal. (Computer programmers love to give complicated names to simple ideas. Get used to it!) String is the term that computer programmers use for text, because computers handle text as a string of characters. Literal means that you are actually specifying the literal value “Hi there, Joe”.

The equals sign (=) indicates assignment. It might make more sense to read this statement as follows: greeting gets the string literal “Hi there, Joe”.

Finally, the word greeting is the name of a JavaScript Variable that gets the string value “Hi there, Joe”.

If you want to give a JavaScript Variable a particular value, you can do so by using a similar assignment statement. Coding a variable assignment statement is like putting leftovers in a container.

Using the Contents of a JavaScript Variable

You carry a lunch bag to keep all your food items neatly in one place. If you pull your lunch bag out of the refrigerator, you are in effect pulling out the entire lunch. In a similar way, you specify a variable’s name to refer to a JavaScript Variable. Take another look at this line: alert(greeting);

When the user runs this Web page, he or she does not see the term “greeting” pop up. Instead, he or she sees “Hi there, Joe,” which is the content of the greeting variable. It doesn’t matter what the value of greeting is, as long as it is some kind of text. This line of code can output any value stored in the JavaScript Variable greeting.

JavaScript Variable Scope

A JavaScript Variable’s scope refers to the locations from which its value can be accessed. JavaScript Variables are globally scoped when they are used outside a function. A globally scoped JavaScript Variables can be accessed throughout your JavaScript program. In the context of a webpage or a document, as you might think of it. You can access and use a global variable throughout.

JavaScript Variables defined within a function are scoped solely within that function. This effectively means that the values of those variables cannot be accessed outside the function. Function parameters are scoped locally to the function as well.

Here are some practical examples of scoping, which you can also find in the companion code in the scope1.txt file

<script type="text/javascript">
  var aNewVariable = "I’m Global.";
  function doSomething(incomingBits) {
  alert(aNewVariable);
  alert(incomingBits);
}
doSomething("An argument");
</script> 

The code defines two variables: a global variable called aNewVariable; and a variable called incomingBits, which is local to the doSomething() function. Both variables are passed to respective alert() functions within the doSomething() function. When the doSomething() function is called, the contents of both variables are sent successfully and displayed on the screen,