Javascript: Variables Naming

Variable names can start with the following characters:

  • Upper- or lowercase letter
  • An underscore (_)
  • A dollar sign ($)
 Although you can use an underscore or dollar sign to start a variable, it’s best to begin with a letter. Unexpected characters can often cause your code to look confusing and difficult to read, especially if you are new to JavaScript coding.

After the first character, you can use any letter or number in your variable name, and it can be any length. JavaScript variables cannot contain spaces, mathematical operators, or punctuation (other than the underscore).

Always remember that JavaScript is case-sensitive. A variable named myname is not the same variable as Myname or myName.

Variable names are actually identifiers; the best thing you can do is to name a variable something precise and relevant. This naming convention may sometimes result in very long names, but as a rule, a longer name that accurately represents the variable is more useful than a shorter name that is vague.

Javascript: Understanding Global and Local Scope

How and where you declare a variable determines how and where your program can make use of that variable. This concept is called variable scope. JavaScript has two types of scope:

  • Global variables can be used anywhere inside of a program.
  • Local (function) variables are variables that you create inside of a protected program within a program, called a function.
In below example, the programmer wants to have a variable called movie that is global, and a separate variable with the same name that is only valid within the function called showBadMovie. This is a perfectly normal thing to do, and under normal circumstances, the movie variable inside the function wouldn’t affect the global variable. However, if you forget to use the var keyword when declaring the movie variable inside the function, bad things happen.

var movie = "The Godfather";

function showGoodMovie () {
  alert (movie + " is a good movie!");
}

function showBadMovie () {
  movie = "Speed 2: Cruise Control";
  alert (movie + " is a bad movie!");
}


Notice that the var keyword is missing from before the movie variable in showBadMovie(). JavaScript assumes that you want to override the global movie variable, rather than create a local function variable. The results are positively disastrous!

showGoodMovie(); // pops up "The Godfather is a good movie!"

showBadMovie(); // pops up "Speed 2: Cruise Control is a bad movie!"


/* Oh no! The global variable is now Speed 2: Cruise Control, not the good movie name anymore! */

showGoodMovie(); // pops up "Speed 2: Cruise Control is a good movie!"

javascript: Declaring Variables

Declaring a variable is the technical term that’s used to describe the process of first creating a variable in a program. You may also hear it called initialization. Creating a variable, declaring a variable, and initializing a variable all refer to the same thing.

Variables in JavaScript can be created in one of two ways:

Using a var keyword:
var myName;

A variable created using a var keyword will have an initial value of undefined unless you give it a value when you create it, such as
var myName = "Chris";

Without a var keyword
myName = "Chris";

When you create a variable without a var keyword, it becomes a global variable. (In order to understand what a global variable means, see the next post.)